DIV的不正常流動

我有一個問題，像正常情況下定位div類。我希望得到的DIV框：DIV的不正常流動

li { 
    width:200px; 
    height:200px; 
    background:red; 
    float:left; 
    list-style:none; 
    margin-right:20px; 
    margin-bottom:50px; 
    position:relative; 
} 

li div { 
    width:100%; 
    height:100%; 
    position:absolute; 
}

但隨後的箱子像絕對定位，它們並不像我想，讓他們 - 在2列，20像素和差距的差距50px的下方，但是它們像插入內容一樣卡住，但是具有20px的邊距 - 右側，正如我所看到的那樣，它是從圖像的左側邊界開始計算的，但邊緣底部是可以的。

然後我生氣並複製了所有的代碼，那是在TutsPlus.com - CSS3基礎視頻 - 仍然無法正常工作。 HTML5一切正常，但我不明白 - 爲什麼我不能像我之前說的那樣得到那些盒子？

來源

2013-05-18 devvy

你嘗試加入'顯示：塊;'到LIS？ –

請顯示所需結果的模型。 jsFiddle也不會傷害！ – sbichenko

我確實已經找到了解決方案。如果還有其他問題，我會寫在這裏，或者可能在其他地方。 – devvy

默認情況下，絕對定位元素將從正常流程中移除。您將它們設置爲100％的寬度，以便它們與李的寬度相同並且相互重疊。

來源

2013-05-18 11:46:55 Rob

您的任何建議都無法幫助我。問題在於，當寬度和高度未應用於圖像時，這是盒子的正面圖像。手動更改尺寸，但感謝你們兩位。 – devvy

我的回答不是一個建議，而是指出爲什麼你的標記不起作用。沒有看到整個事情，我無法給你一個解決方案。 – Rob

如果你的問題是，它的<li> s爲不兩列，你可以使<ul>有440px的寬度（這是<li>有餘量）由兩個multiplited的200 + 20 px（寬度）。基本上是：

ul { 
    width: 440px 
    }

jsFiddle

來源

2013-05-19 12:18:46 sbichenko

DIV的不正常流動

回答

相關問題