CSSでは、2つ以上のボックス（兄弟など）の隣接したマージンを結合して単一のマージンを形成することができます。このようなマージンの結合は「マージンの折り畳み」と呼ばれます。

　隣接する垂直方向のマージンは、以下の例外を除いて結合して単一のマージンとなります（マージンの折り畳み）。

• ルート要素のボックスのマージンは折り畳みされません
• クリアランスのある要素の上下のマージンが隣接している場合、そのマージンは後続の兄弟の隣接マージンと折り畳みされますが、親ブロックのマージンとは折り畳みされません

　水平方向のマージンは、決して折り畳みされることはありません。

　2つのマージンは、次の場合にのみ隣接しているとみなされます。

• どちらも、同じブロック整形文脈のインフローのブロックレベル・ボックスに属している
• ラインボックス、クリアランス、パディング、ボーダーを持たない（これにより高さゼロのラインボックスは無視されます）
• 両方とも垂直に隣接するボックスエッジに属する（すなわち次の組み合わせ）
  • ボックスのトップマージンとその最初のインフローの子のトップマージン
  • ボックスのボトムマージンと後続の兄弟の次のインフローのトップマージン
  • 最後のインフローの子のボトムマージンと（その親がautoで計算された高さを適用する場合）その親のボトムマージン
  • 新しいブロック整形文脈を確立せず、高さの最小値にゼロまたはautoで計算された高さを適用するブロックボックスと、インフローの子を持たないボックスののトップとボトムマージン

　折り畳みされたマージンは、そのコンポーネントのマージンのいずれかが別のマージンに隣接している場合、隣接しているとみなされます。

　隣接するマージンは、兄弟や祖先以外の要素でも発生します。

　上記に規則は、以下を意味します。

• フロート化されたボックスと別のボックスの間のマージンは折り畳みされない（フローとフロート内の子の間でさえも）
• フロートやvisible以外のoverflowを持つ要素のような新しいブロック整形文脈を生成しない要素はインフローの子要素と折り畳みする
• 絶対的に配置されたボックスのマージンは折り畳みしない（それらの子でさえも）
• インラインブロックボックスのマージンは折り畳みしない（インフローの小でさえも）
• インフロー・ブロック・レベルの要素のボトム・マージンは、次のインフロー・ブロック・レベルの兄弟がクリアランスを持たない限りそのトップマージンと常に折り畳みします
• インフローブロック要素のトップマージンは、要素にトップボーダーがなく、トップパディングがなく、子要素にクリアランスがない場合、最初のインフローブロックレベルの子のトップマージンと折り畳みする
• hightがautoでmin-heightがゼロのインフローブロックボックスのボトムマージンは、その最後のインフローブロックレベルの子のボトムマージンと折り畳みする （もしそのボックスがボトムパディングを持たず、ボトムボーダーを持たず、子のボトムマージンがクリアランスを持つトップマージンと折り畳みしない場合）
• min-jeightプロパティがゼロで、トップボーダー、ボトムボーダー、トップパディング、ボトムパディングのいずれも持たず、heightプロパティがゼロまたはautoで、ラインボックスを持たず、そのボックスのインフローのすべての子のマージンが折り畳みする場合、ボックス自身のマージンは折り畳みする

　2つ以上のマージンが折り畳みされる、結果として得られるマージンの幅は折り畳みされるマージンの幅の最大値になります。負のマージンの場合、負の隣接マージンの絶対値の最大値が正の隣接マージンの最大値から差し引かれます。正のマージンがない場合、隣接するマージンの絶対値の最大値はゼロから差し引かれます。

　ボックスのトップ/ボトムマージンが隣接している場合、マージンが折り畳みされる可能性があります。この場合、要素の位置はマージンが折り畳みされている他の要素との関係に依存します。

• 要素のマージンが親のトップマージンと折り畳みされている場合、ボックスのトップボーダーのエッジは親と同じになるように定義されます。
• それ以外の場合は、要素の親がマージンの折り畳みに関与しないか、または親のボトムマージンのみが関与します。その要素のトップボーダーのエッジ位置は、要素のボトムボーダーがゼロでない場合と同じです。

　折り畳みされた要素の位置は、マージンが折り畳みされている他の要素の位置には影響しません。トップボーダーエッジの位置は、これらの要素の子孫をレイアウトするためにのみ必要です