html - 内部 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。