CSS：这个边界来自哪里？

Question

这是我的问题：http://jsfiddle.net/gregseth/548S2/

为什么元素之间有空白？我该如何摆脱它？

此外，为什么的尺寸在jsfiddle中没有考虑到，当它位于“普通”HTML页面（Firefox）上时？

Answer 1

这是因为

nav a { display:inline-block; } 

如果您想更改为：

nav a {  
    display:block; 
    float:left; 
} 

的利润都没有了。

的jsfiddle：http://jsfiddle.net/548S2/3/

Answer 2

这是html中的<a>元素之间的空格（换行符）。这发生在所有inline或inline-block元素上。

选项1： 在<a>代码中使用margin-right:-4px;。

选项2： 删除<a>标记之间的空格。

OPTION 3： 变化在其他的答案中描述的<a>标签display:block; float:left。在这种情况下，您需要修复容器元素的高度（在您的案例中为<nav>），或者在下一个元素上使用clear:left以防止浮动与其重叠。有时避免这种浮动方法并使用其他选项之一是有用的。

Answer 3

这是HTML的渲染空间时，块中的项目之间有一个空格或断行的结果。您可以漂浮的物品向左：

http://jsfiddle.net/548S2/4/

或删除换行符元素之间：

http://jsfiddle.net/548S2/2/

Answer 4

只是适用浮动：左的“导航一”在CSS中。