html - セクション タグが動かない

Question

mainBody の ID を持つセクション タグ内のセクション タグが押し下げられていません。メインボディの上部から 20 ピクセル下にあるはずです。コード: Index.html: http://paste.ubuntu.com/1361141/ reset.css および main.css: http://paste.ubuntu.com/1362043/

Answer 1

これはマージン崩壊と呼ばれ、正常な動作です。 http://reference.sitepoint.com/css/collapsingmargins

.news 要素のマージン (上下) を削除するだけです。そして追加：

padding: 20px 0 ; 

#本体に

さらに、Section 要素を正しく使用していません #mainBody はほぼ確実に div である必要があります。

Answer 2

マージンの縮小について詳しくは、https ://developer.mozilla.org/en-US/docs/CSS/margin_collapsingを参照してください (MDN のドキュメントを好む場合)。