html - 内联块如何消除间隙

Question

我想内联显示两个 div，一个 div 是 25%，另一个是 75%，当我使用时：

display: inline-block;

它似乎在两个 div 之间产生了间隙，这显然会降低 75% 的 div。

如何消除间隙？我用了：

vertical-align: top;

这已经消除了顶部间隙......现在只需要消除侧面间隙。

见这里jsfiddle。

score 7 · Accepted Answer

问题是你的两个div元素之间有一个空格，并且因为它们是内联块显示的，所以它的呈现就像普通文本中两个字母之间的空格一样。

解决方案是在容器上使用负字间距：

word-spacing: -1em;

score 1 · Accepted Answer

这是因为 HTML 中的 div 之间有空格。使它像这样：

<div class="grid_one">

</div><div class="grid_two">

</div>

或者，使用float:left;，但记得在那之后清除浮动或给容器一个height..

score 0 · Accepted Answer

0

只需添加float:left;到头等舱。

于 2013-08-22T14:57:33.947 回答

score 0 · Accepted Answer

蒂姆是正确的，它是创建边距的空白。

另一个解决方案是添加一个margin-right: -4pxto .grid_one，检查更新的 fiddle。

score -1 · Accepted Answer

-1

漂浮的左边是你错过的珍贵宝石

Float:left;

于 2013-08-22T14:57:21.417 回答

score -1 · Accepted Answer

-1

为什么不是float: left;div？

于 2013-08-22T14:57:22.823 回答

6 回答 6