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

回答

相關問題