CSS溢出：列表中一个div

我有一个图片库，我不想给一个额外的类来第三列表项：CSS溢出：列表中一个div

<div class="row"> 
     <ul class="rowUl"> 
      <li>ssss</li> 
      <li>ssss</li> 
      <li>ssss</li> 
     </ul> 
    </div>

和CSS

.row { 
    width: 620px; 
    clear: both; 
    overflow: hidden; 
} 

.rowUl { 
    width: 645px; 
    float: left; 
} 

.rowUl li { 
    width: 220px; 
    float: left; 
}

但第三个列表项下降在其他行。我怎样才能解决这个没有额外的课程？

来源

2010-05-20 Felicita

220 * 3 = 660，

rowUL = 645

这就是15个额外的像素推浮动DIV下来。

解决方案：

让rowUL宽度660，使行宽660

OR：

使rowUL李宽度215

来源

2010-05-20 08:55:51 Glycerine

是的，我的数学错误！谢谢 – Felicita 2010-05-20 09:00:37

没有麻烦 - 我一直在这样做。 – Glycerine 2010-05-20 09:07:49

尝试增加width从645px到.rowUl更大的价值，如果可行的话。

来源

2010-05-20 08:55:19 Sarfraz

你有3个浮动LI元素，每220px宽。 3 * 220 = 660，但包含元素的宽度仅为645px，因此第三个不能放入第二个元素旁边，并落在第一个元素下面的另一行。如果你想将它们全部放在一行中，请将.rowUl的宽度设置为660px。

此外，我不知道您是否使用某种CSS重置 - 如果您不这样做，请注意UL和LI元素的默认边距和填充也会影响此事实。如果你想确定它们没有，你需要将它们设置为0。

来源

2010-05-20 08:56:39 michalstanko

即时通讯使用eric meyer css重置。对不起这个数学错误。今天我必须喝更多的咖啡:) – Felicita 2010-05-20 09:13:32

您已经通过645px超过宽度限行内元素的内660px（每个220px所有三个元素）

您可以通过外元素超过660px

增加宽度做

希望这会有帮助
迈拉

来源

2010-05-20 09:00:39 Myra

CSS溢出：列表中一个div

回答

相关问题