Firefox上的div填充/ ie7

如何解决Firefox上的div填充/ ie7

| 有什么方法可以像Firefox一样使IE7正确解释CSS？我在width + padding div属性上遇到了问题。在FF / IE8 +上，div自动扩展，并且该div中的内容正确居中，但是在IE7 div中，div向右移动，溢出部分隐藏了其余内容。看下面的图片：填充预览http://uploadpic.org/storage/2011/D8AHkOOwH8DhIFlogShP0zhPG.jpg 有什么办法可以破解吗？一些CSS代码：

#center { width: 50%; height:auto;  position:relative; padding-left:500px; }
#both { width:1000px; float:right; }
#content_home { width:698px; margin:0 auto; min-height:400px;
     float:left; position:relative;  }

和HTML代码：

<div id=\"center\">
    <div id=\"both\">
        <div id=\"content_home\">
            <p>...</p>
        </div>
        <div id=\"right\">
            <p>...</p>
        </div>
    </div>
    <div class=\"clear\"></div>
</div>

解决方法

最好的方法是使用特定样式定位IE7及以下版本，因为它们错误地应用了盒模型。您可以使用有条件的正文标签来执行此操作，例如

  <!-- Conditional CSS include for IE6 and below -->
  <!--[if lt IE 7 ]><body class=\'ie6\'><![endif]-->
  <!-- Conditional CSS include for IE7 -->
  <!--[if IE 7 ]><body class=\'ie7\'><![endif]-->
  <!-- Conditional CSS include for IE8 -->
  <!--[if IE 8 ]><body class=\'ie8\'><![endif]-->
  <!-- Conditional CSS include for IE9 -->
  <!--[if IE 9 ]><body class=\'ie9\'><![endif]-->
  <!--[if !IE]>--><body><!--<![endif]-->

然后在您的CSS中...

body.ie7{
  width:12345px;
}

, 不知道这是否适合您的情况，但是您是否尝试过IE7.js修复程序？这是一个方便的javascript文件，旨在使IE浏览器符合标准。可能值得一试。 http://code.google.com/p/ie7-js/