javascript - 聖杯のレイアウトに関する少しの疑問

Question

これは標準的な聖杯レイアウトです。これは HTML コードです。

リーリー

sheng.png

Answer 1

Webページの要素はHTMLの記述順とフローモデルに従って分散されます。
ここでの left 要素には位置がないため、次の行に流れます。ここで、margin-left を独自の幅に負の値に設定します。これは、位置を占有しないことと同じなので、最初の行の終わりに流れます。
margin-left の負の値が増加すると、ゆっくりと左にシフトします。

Set
margin-left: -100%; // 親要素の幅の 100% に相当します
左の要素は最初の行の左端に配置されます。