一篇关于IE6下Li标签左边多出宽16pxBUG的问题

穷则独善其身,达则兼善天下。你既然认准一条道路,又何必去打听要走多久。

偶然发现,IE6的Li标签左边会多出16px的宽度,即使把list-style-type设置成none。而在Firefox中却是正常的(IE其它版本没测试,不过应该是和Firefox一样的)。

经验证,其实是IE6的list-style-position属性造成的,默认情况下,Firefox中list-style-position值为 outside,即列表项符号会在LI标签的外面显示。而IE6的默认值则相反(inside)。不过这还不是问题关键,IE6完全是属于占着茅坑不拉屎 的那种,即使你不显示列表项符号,即把list-style-type设置成none,它依然会保留列表项符号占用的空间。所以无论你给LI的设置 margin:0或者padding:0,你都会发现Li左边会多出16PX的空间。

既然知道问题的关键,解决起来就不难了,直接设置 ul 的样式为

list-style-position:outside;

OK,把项目符号赶到LI的外面去,让IE6去哭吧。。。

以上就是一篇关于IE6下Li标签左边多出宽16pxBUG的问题。人生如白驹过隙死不足恨但夙心往志,不闻于末世矣。更多关于一篇关于IE6下Li标签左边多出宽16pxBUG的问题请关注haodaima.com其它相关文章!

您可能有感兴趣的文章
IE8下显示图片时多出一个边框而Chrome或Firefox下却没有

CSS 网页布局问题 li上多出的margin问题

如何解决在IE6下文字溢出(多出一行字)的如何解决方法小结

一篇关于CSS浮动与取消浮动的问题

一篇关于CSS中定位的小结