Question

我在定位导航元素方面遇到了问题。

CSS：

#wrapper { width: 600px; margin: 0 auto; height: 300px; background: #f9f9f9; border: 1px solid #f0f0f0; }
#navigation { margin: 0 auto; text-align: center; }
.mylink { background: #666; color: #ccc; padding: 5px 10px; display: inline-block; }
.mylink:first-child { -webkit-border-top-left-radius: 10px; -moz-border-radius-topleft: 10px; border-top-left-radius: 10px; }
.mylink:last-child { -webkit-border-top-right-radius: 10px; -moz-border-radius-topright: 10px; border-top-right-radius: 10px; }

HTML：

<div id="wrapper">
    <div id="navigation">
        <a class="mylink">Homepage</a>
        <a class="mylink">Second Page</a>
        <a class="mylink">Third Page</a>
    </div>
</div>

我想删除内联元素的边距。我也试过了“浮动：左”的变化。但是，如果没有宽度值，我就无法将这些元素集中在一起。

我有什么想法可以解决它？

Answer 1

这是'内联块'的常见问题。你没有处理保证金，而是处理实际的空间特征。

这应该有所帮助：http://css-tricks.com/fighting-the-space-between-inline-block-elements/

Answer 2

你没有边距，内联元素只需要考虑空格（空格，制表符，换行符，其他任何不可见的分隔符），使用块显示和浮点数或者在没有空格的情况下键入它，更新你的小提琴{ {3}}

CSS从内联元素中删除边距

2 个答案: