0

html

 <ul class="social">
 <li><a class="html5" href="#html5"></a></li>
 <li><a class="twitter" href="#twitter"></a></li>
 <li><a class="facebook" href="#facebook"></a></li>
 <ul>

一切正常，但不适合保证金？我需要它像我页面的其余部分一样冲洗......有什么建议吗？

css

.social ul
{
list-style-type:none;
margin:0;
padding:0;
}
.social li
{
display: inline-block;
}
4

2 回答 2

1

在 CSS 中，您尝试将边距和填充设置为“0”，但由于您的路径错误

-> .social ul

我认为应该是：

-> ul.social

于 2013-03-10T17:07:06.347 回答
0

在小提琴中，<ul>仍然有默认的 40px 的左填充和 16px 的顶部/底部边距，所以只需添加margin: 0; padding: 0;到无序列表中。每个浏览器都会将此填充/边距添加到列表中 - 我建议使用 CSS 重置，以便您可以显式重置每个元素的默认浏览器样式。查看此以获取更多信息

其次inline-block，元素是依赖于空白的，因此如果您注释掉或删除标记中的空白（在 之间<li>），图像之间的水平空间将减少。

编辑：它确实水平显示内联..margin: 0; padding: 0;没有生效的原因是因为.social ul暗示无序列表是具有类 .social 的某些元素的后代，而不是，所以默认的填充/边距保持不变。

于 2013-03-10T17:03:33.653 回答