提问者:小点点

内联块元素中出现意外填充[重复]


运行下面的代码片段,你会看到这两个balck框占据的空间超过了它们所需的空间(垂直)。 为甚么会这样呢? 我曾尝试将边距/填充设置为0,但没有工作。

null

div.ex4 {
  display: block;
  background-color: lightblue;
  overflow: visible;
}

.imag {
    width: 20px;
    height: 20px;
    background-color: black;
    display: inline-block;
    margin: 0px;
    padding: 0px;
}
<div class="ex4"><div class="imag"></div><div class="imag"></div></div>

null


共1个答案

匿名用户

使用font-size:0;

null

div.ex4 {
  display: block;
  background-color: lightblue;
  overflow: visible;
font-size: 0;
}

.imag {
    width: 20px;
    height: 20px;
    background-color: black;
    display: inline-block;
    margin: 0px;
    padding: 0px;
}
<div class="ex4"><div class="imag"></div><div class="imag"></div></div>