フレームモデル：CSS 外側マージンの合併
- 前のページ CSS 外側マージン
- 次のページ CSS 定位の概要
外側マージンの合併とは、二つの垂直外側マージンが合わさると、それらが一つの外側マージンを形成することを指します。
合併した外側マージンの高さは、合併する外側マージンの高さの中で大きい方です。
外側マージンの合併
外側マージンの合併（重ね合わせ）は非常に単純な概念ですが、実際にウェブページのレイアウトを行う際には、多くの混乱を引き起こします。
簡単に言えば、外側マージンの合併とは、二つの垂直外側マージンが合わさると、それらが一つの外側マージンを形成することを指します。合併した外側マージンの高さは、合併する外側マージンの高さの中で大きい方です。
ある要素が他の要素の上に現れる場合、最初の要素の下外側マージンと第二の要素の上外側マージンが合併します。以下の図を参照してください：
ある要素が他の要素に含まれている場合（内側マージンや枠線で外側マージンが分離されていないと仮定すると）、その上外側マージンと下外側マージンも合併します。以下の図を参照してください：
見た目が奇妙なようですが、外側マージンは自分自身と合併することもできます。
空要素がある場合、外側マージンがあるが、枠線や余白がない場合があります。この場合、上外側マージンと下外側マージンが合わさり、合併します：
この外側マージンが別の要素の外側マージンに当たると、さらに合併が発生します：
これが一連のパラグラフ要素が非常に小さいスペースを占める理由です。なぜなら、彼らのすべての外側マージンが合併して、小さな外側マージンが形成されるからです。
外側マージン合併は最初は少し奇妙に見えるかもしれませんが、実際には意味があります。典型的なパラグラフで構成されたテキストページを例に取ると、最初のパラグラフの上のスペースはパラグラフの上外側マージンと等しいです。外側マージン合併がなければ、後続のすべてのパラグラフ間の外側マージンは相邻の上外側マージンと下外側マージンの和になります。これは、パラグラフ間のスペースがページのトップの2倍になることを意味します。外側マージン合併が発生すると、パラグラフ間の上外側マージンと下外側マージンが合併し、すべての距離が一致します。
注記：通常のドキュメントフローのブロックフレームの垂直外側マージンのみが外側マージン合併が発生します。インラインフレーム、フロートフレーム、絶対定位の間の外側マージンは合併しません。
- 前のページ CSS 外側マージン
- 次のページ CSS 定位の概要
