ボックスモデル - CSS2リファレンス
マージンの相殺（Collapsing margins）
相互に隣り合っているか入れ子関係にある複数のボックス間において，（その間が空でない内容，パディングもしくはボーダーで隔てられずに）隣接するマージン同士が結合してひとつのマージンになることを「マージンが相殺される」（collapsing margins）と謂います。
水平マージンは相殺されません。垂直マージンは以下の条件に依って異ります：
- 通常に流し込まれる（’position’ の値が ‘static’ な）複数のブロックボックス間で相殺が行われる：
- 隣接するマージン同士が正であるならば，その最大値を用いる。
- 正負が混在しているなら，最大と最小を足し合せた値を用いる。
- 正の値が存在しないなら，隣接するマージンの最小値を用いる。
- フロート（’float’ の値が ‘none’ 以外のボックス）と他のあらゆるボックスとの間では，マージンは相殺されない。
- 絶対位置決め（’position’ の値が ‘absolute’ か ‘fixed’ ）のボックスにおいては，マージンは相殺されない。
次のリストからは，CSS2.1仕様において新たに追加され，明確にされた条件です：
- インライン-ブロック要素（’display’ の値が ‘inline-block’ であるボックス）のマージンは相殺されない。
- ‘overflow’ の算出値が visible’ 以外であるボックスは，その子供ボックスのマージンとの間で相殺されない。
- あるボックスの上マージンまたは下マージンが隣接するとき，それらは通り越して相殺されることもある。
- その場合の要素配置は，マージンが相殺されている別の要素との関係に依存する。
- ある要素の上マージンと親の上マージンの間で相殺されるなら，ボックスのボーダー上辺は，親のボーダー上辺と一致する。
- そうでなければ，要素の親はマージンの相殺に係らないか，あるいは親の下マージンだけが相殺に係ることになる。そして当該要素の持つボーダー上辺の位置については，その要素がゼロ幅以外の上ボーダーを持っている時と同じになる。
- クリアランスを持つ要素の上マージンは，その親ブロックの下マージンとの間で相殺されない。
- その場合の要素配置は，マージンが相殺されている別の要素との関係に依存する。
- ルート要素（HTML文書であればhtml要素）が生成するボックスのマージンは相殺されない。
