marginの相殺 CSSにおけるmarginプロパティはボックスに対して余白部分を生成するというシンプルなものなのですが、『marginの相殺』という特徴があります。 marginの相殺について解説をしてみます。 垂直方向のmargin相殺 垂直方向に隣接するボックスのmarginは相殺され、margin値が大きいブロックレベル要素のmargin値が採用されます。 図では、上のボックスの下マージン(100px)が下のボックスの上マージンより大きい為、相殺されmargin値が大きい100pxのマージンが両ボックスの間に設けられます。 ただし、どちらかのmarginがネガティブマージンつまり、-の値をもつマージン値の場合は相殺されません。 図では、上のボックスのマージンがマイナス、下のボックスのマージンがプラスと符号が異なる為、相殺されず-50px+80pxの30pxがそれぞれのボックスの間
![marginの相殺](https://cdn-ak-scissors.b.st-hatena.com/image/square/a9717624309e36a795026e1b70982163687ccca2/height=288;version=1;width=512/https%3A%2F%2Fblog.webcreativepark.net%2Ficon_200x200.png)