两个DIV的半宽度变长了容器

Question

我使用了CSS：

div.half {
  width: 50%;
  display: inline-block;
}

HTML：

<div>
  <div class="half">...</div>
  <div class="half">...</div>
</div>

当然，正如预期的那样，由于边框和填充， DIV 的范围太广了。所以我添加了 box-sizing ，它之前帮助了我并得到了这个CSS：

div.half {
  box-sizing: border-box;
  width: 50%;
  display: inline-block;
}

然而，这一次，我在那里有一个换行符。这是一个惊喜。我错过了什么？

Answer 1

两个内嵌块框之间有一个空格。它来自换行符。

在这个例子中，我已将两个<div>移动到同一行，两者之间没有空格。

http://jsfiddle.net/7ks3Y/

<div>
  <div class="half">...</div><div class="half">...</div>
</div>