Question

假设我有几个内联块div标签，比如这个

<div class="image">

</div>
<div class="image">

</div>

类图像只是将它们的大小设置为100x100和灰色背景颜色。它们的边距和边框设置为0，但两个矩形之间有间距。

如果我写这样的HTML，那么：

<div class="image">

</div><div class="image">

</div>

删除div之间的所有空格，间距消失。

因为我不想这样写我的HTML，所以我认为必须有一种方法可以使用CSS删除空格。只要它的可见性被删除，我不在乎是否删除，隐藏或缩小空格。

感谢您的帮助

根据要求，JSFiddle：http://jsfiddle.net/6h3Jx/

使用字间距更新：http://jsfiddle.net/6h3Jx/1/

Answer 1

它是内联元素行为，因此请尝试向左浮动。 http://jsfiddle.net/aVrSx/

Answer 2

你可以设置＆＃34;显示：flex;＆＃34;属性为其父包装器：

.flexbox {
  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox;      /* TWEENER - IE 10 */
  display: -webkit-flex;     /* NEW - Chrome */
  display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
}

Answer 3

将以下内容放在父元素上：

word-spacing:-4px;

或尝试：

font-size:0px;

它可能会更好，因为它不会受到文本大小调整的影响。

如何删除内联元素之间的空格可见性？

3 个答案: