html - ie6边距扩大20px

Question

我将 div 包裹在我的 html 代码下面。

    <div id="content-row">
         <div id="left-box">
              <div id="small-box">
              </div>
              <div id="small-box">
              </div>
              <div id="small-box">
              </div>
              <div id="small-box">
              </div>
        </div>
     </div>

我的CSS是

/*content-row*/
#content-row {
    margin: 0 auto!important;
    padding-left:50px;
    width:990px;
    height:320px;
    padding-bottom:20px;    
}
#left-box {
    float:left;
    width:360px;
    height:340px;
}
#small-box {
    width:160px;
    height:150px;
    background-color:#fff;
    float:left;
    margin:0px 20px 20px 0px;
}

以上样式表专用于ie6。我的问题是左框在右侧多了 20px。当我将左框定义为 360px 时；它取为 380px；

这里是完整代码的链接。

http://jsfiddle.net/HXGsT/

代码有什么问题？

Answer 1

这是 IE6 中的已知 bg，请参阅此页面了解更多信息: http://www.positioniseverything.net/explorer/doubled-margin.html

基本上，快速修复是将 display: inline; 添加到 float 元素。