https://jsfiddle.net/0k02qsjw/1/なぜ非浮動子供は浮きません
.left1 {
background-color:red;
width:100px;
height:100px;
float:left;
}
.left2 {
background-color:blue;
width:100px;
height:100px;
}
//左3 left4 left2に似て。フィドル
<div class="left1">Div1</div>
<div class="left2">Div2child</div>
<div class="left3">Div3</div>
<div class="left4">Div4</div>
私はフロートを学び、CSSでクリアして、1つの問題に固執しています。上記の例では、各divを個別に浮動させるとき、Floatは期待どおりに動作します。私がleft1を浮かべると、left2は予想どおりに動きます。しかし、なぜ左の子どもたちは上に動かないのですか?
浮動小数点型の要素が流れていないことを理解しています - その理由があるかもしれません。 もしそうなら、なぜleft2上に隠されたオーバーフローはleft2が浮かんだかのように機能します(下記参照)。
https://jsfiddle.net/0k02qsjw/2/
この場合、何が起こっているのか理解するのに助けが必要です。これは
Floating elements within a div, floats outside of div. Why?
の重複可能性がしかし、私はそこに私の特定の質問への答えを見つけることができません。