无序列表将无法在div内正确对齐

问题描述：

图像位于列表项li之内，它位于div内的无序列表ul之内。

我遇到的问题是，当我做一个无序列表显示内联，它不像div应该左对齐，它开始大约40像素英寸我试图设置position:absolute;left:0;在ul但它没有什么区别。

position:absolute;应该使其相对于其父元素对齐，但它不是这样做的。

这是显示问题的JSFiddle。

（红色块是div，它是红色只是为了告诉那里的div一边是所以你可以看到多远关闭UL）

有我丢失的东西？为什么图像在它应该在的位置右侧开始40像素？

答

CSS

#navbar ul{ 
    position:absolute; 
    left:0px; 
    margin:0 0 0 0; 
    padding: 0 0 0 0; 
}

具体来说，我认为这是填充 – Romski 2013-05-14 02:55:48

是的，我只是在清理他的边缘。 – npage 2013-05-14 02:57:12

是的，问题是'ul'上的'padding-left'' – 2013-05-14 02:59:37

答

您需要添加填充：0;

#navbar ul{ 
    padding:0; 
}

而且，你可能要考虑这样做两件事情将引起你类似的问题：

1）继承

继承的东西在那里，如果你不指定特定的值，它会简单地从父母那里获取相同元素的价值。

2）CSS重置

所有浏览器都有自己的默认值某些事情。如果要完全控制，则要确保重置其中一些值。它很可能会影响您的网站加载速度。

它为我工作 – 2013-05-14 02:51:31

我认为你应该使边距和填充等于0.你试过吗？ – 2013-05-14 02:53:22

是的，它不起作用。 – 2013-05-14 02:53:40

答

ul等列表有40像素padding-left默认情况下，在旧的IE是margin，所以只是删除空白和边距。