Fatal编程技术网
  • css/
  • IE 6/7 CSS问题：无序列表中列表项的额外填充/边距

IE 6/7 CSS问题：无序列表中列表项的额外填充/边距

css internet-explorer

IE 6/7 CSS问题：无序列表中列表项的额外填充/边距,css,internet-explorer,Css,Internet Explorer,我在我正在建设的一个网站上遇到了IE6和IE7的问题，你可以这样做。侧边栏和菜单无序列表之间突然出现了一些额外的空间 这是IE6 这是IE7 这是IE8 IE9也可以工作 如您所见，IE8和IE9工作正常。菜单紧靠着侧边栏。我一直在玩弄它有一段时间了，但还没能把它修好 HTML结构只是一个div>ul>lia 在编写任何代码之前，我也通过CSS重置将所有内容归零。有人知道这是什么原因吗 非常感谢您的帮助没有CSS很难说 但我想说几件事： 它是否需要为IE6/7人群提供完美的像素？

我在我正在建设的一个网站上遇到了IE6和IE7的问题，你可以这样做。侧边栏和菜单无序列表之间突然出现了一些额外的空间

这是IE6


这是IE7


这是IE8


IE9也可以工作


如您所见，IE8和IE9工作正常。菜单紧靠着侧边栏。我一直在玩弄它有一段时间了，但还没能把它修好

HTML结构只是一个div>ul>lia

在编写任何代码之前，我也通过CSS重置将所有内容归零。有人知道这是什么原因吗

非常感谢您的帮助

没有CSS很难说

但我想说几件事：

  • 它是否需要为IE6/7人群提供完美的像素？该网站看起来不错，即使有缩进，所以可能不需要修复

  • 如果您确实需要修复它，为什么不使用一些针对IE6/7的工具，然后设置一个负边距

    • 尝试将
    display:inline
    、
    float:left
    和
    width:100%
    添加到
    li
    中

    在中测试。

    为了更好的可移植性，您需要规范化样式，不同浏览器的默认值略有不同

    1）您必须在html页面的head标记之前添加这些行

    <!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ --> 
<!--[if lt IE 7 ]> <html class="no-js ie6 ieb" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <![endif]-->
<!--[if IE 7 ]>    <html class="no-js ie7 ieb" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <![endif]-->
<!--[if IE 8 ]>    <html class="no-js ie8" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <![endif]-->
<!--[if gte IE 9 ]>    <html class="no-js ie9" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <![endif]-->
<!--[if !IE]><!--> <html class="no-js" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <!--<![endif]-->
    你可以通过放置

    ul, li {
   list-style-position: inside;
}
    如果您已经将每个填充边距归零。

    可能与haslayout有关：Firebug Lite没有告诉您它来自哪里吗？还是IE自己的调试工具？我同意杰森的观点，是时候让我工作了！我将display:inline添加到#边栏ul li，然后将display:block添加到#边栏ul lia@GarrettLeyenaar很高兴能帮上忙。它不需要像素完美，但我只是想提高我的技能，弄清楚它为什么这么做。谢谢你的帮助！我感谢你抽出时间！ 
    ul, li {
   list-style-position: inside;
}