回答編集履歴
1
文章の脱字を修正
answer
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
基本的にhtmlは親要素の中に子要素が入っているのですが、`float`は名前のとおり、要素を浮かせて左右に配置するプロパティで、親要素は浮いた子要素を認識できず、高さが0になります。
|
|
1
|
+
基本的にhtmlの表示は親要素の中に子要素が入っているのですが、`float`は名前のとおり、要素を浮かせて左右に配置するプロパティで、親要素は浮いた子要素を認識できず、高さが0になります。
|
|
2
2
|
|
|
3
3
|
なので記述されたhtmlだと、`.image-block`の`padding: 150px 0;`があるため、高さ300pxだけ背景色が効いて、`.image-block_inner`は子要素を認識できず高さは0に、その子要素は親要素からはみ出た状態になっています。
|
|
4
4
|
これは、それぞれの要素に`border`を指定するとわかりやすくなります。
|