内部 div 相对于包装器具有不需要的空间

Question

我找不到解决办法..

我有三个相邻的 div 浮动，以在包装 div 中创建一个 3 列布局。由于某种原因，左边的距离包装器的边框 40px。 其他一切都很完美，只是左边有一些不需要的空间。

这是我的代码..

html:

<div id="panelwrapper">
   <ul>
      <li>
         <div id="panel-left">
         </div>
      </li>

      <li>
         <div id="panel-mid">
         </div>
      </li>  

      <li>
         <div id="panel-right">
         </div>
      </li>                                    
   </ul>
</div>

css:

#panelwrapper   {
    height: 398px;
    width: 1023px;
    border: 1px solid black;
    clear: both;
}

#panelwrapper ul li {
    display: inline;
}

#panel-left {
    width: 339px;
    height: 396px;
    border: 1px solid red;
    float: left;
}

#panel-mid  {
    width: 339px;
    height: 396px;
    border: 1px solid blue;
    float: left;
}

#panel-right    {
    width: 339px;
    height: 396px;
    border: 1px solid green;
    float: left;
}

Answer 1

您使用的是 CSS 重置样式表吗？

如果不是，您需要将 UL 的边距/填充设置为 0。