CSS 从内联元素中删除边距答案

【问题标题】：CSS Remove margins from inline elementsCSS 从内联元素中删除边距
【发布时间】：2012-09-27 21:13:12
【问题描述】：

我在定位导航元素时遇到问题。

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>

我想删除内联元素的边距。我也尝试了“float:left”变体。但是，如果没有宽度值，我就无法将元素居中。

有什么办法可以解决吗？

【问题讨论】：

标签： css center margin inline

【解决方案1】：

这是“内联块”的常见问题。您处理的不是边距，而是实际的空格字符。

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

【讨论】：

【解决方案2】：

你没有边距，内联元素只考虑空格（空格，制表符，换行符，任何其他可能存在的不可见分隔符），要么使用块显示和浮动，要么在没有空格的情况下键入它，更新你的小提琴@ 987654321@

【讨论】：