不能去掉inline-block元素之间的空格 [英] Can't get rid of spaces between inline-block elements

问题描述

请参阅以下示例：
http://jsfiddle.net/Gv6w3/

如你所见，这是一个简单的菜单项设置为 display：inline-block; 得到菜单项相互冲洗 - 我有边距设置为0px，但我不能摆脱它们之间的间距？发生了什么？

As you can see, it's a simple example of menu items set to display:inline-block; All I'm trying to do is get the menu items flush against each other- I have margins set to 0px, but i can't get rid of the spacing between them? What is going on??

编辑：只注意到重复，我的错：如何删除inline-block元素之间的空格？， display：inline-block extra margin

EDIT: Just noticed duplicates, my bad: How to remove the space between inline-block elements?, display: inline-block extra margin

推荐答案

将一个的关闭标记和下一个元素的开放标记放在同一行上：

put the close tag of one and the open tag of the next element on the same line:

<div class="top-menu-item">
Item 2
</div><div class="top-menu-item">
Item 3</div>

内联元素占用它们之间的空格，并且呈现为1个空格。如果你把下一个元素直接放在前一个元素之间，那么之间不会有空格，空格就会消失。

Inline elements take the whitespace that is between them and this renders as 1 space. If you put the next element directly after the previous there will be no whitespace in between and the space will be gone.

这篇关于不能去掉inline-block元素之间的空格的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！