奇怪的div浮動行爲

請解釋爲什麼具有「asd」內容的div低於紅色div？奇怪的div浮動行爲

HTML：

<div class="class0">0</div> 
<div style="padding-left: 150px;"> 
<div class="class1">1<br>1</div> 
<div class="class1">2<br>2</div> 
<div class="class1">3</div>  
<div style="clear:both;"></div> 
<div>asd</div> 
</div>

CSS：

.class0 { 
    display: block; 
    width: 150px; 
    float: left; 
    background: red; 
    height: 300px; 
} 

.class1 { 
    display: block; 
    width: 150px; 
    float: left; 
    margin: 0 50px 50px 0; 
}

我認爲它應該帶有類class1 3格之後（右側空間，在這個例子中是空的）。不清楚都應該清除父容器內的浮動內容，但不是在整個文檔中？

來源

2013-07-23 Vladimirs

因爲'clear：both'風格div – Novocaine

你能指定你想要的那個div嗎？ –

因此，但我想他問爲什麼有elft的空間。這是因爲你沒有關閉div填補了左邊：150 px – DeiForm

clear:both使其滑落。你想要它？

來源

2013-07-23 13:40:12

奇怪的div浮動行爲

回答

相關問題