marginの相殺 - soyjoynice @ ウィキ

たとえば
.classA　と .classB　が上下に並んでるとして、
.classA {margin-bottom: Xpx;}
.classB {margin-top: Ypx;}
となっているとき、

X	Y	採用されるのは	解説
100px	50px	X = 100px	数値が大きい方が採用される
50px	100px	Y = 100px	数値が大きい方が採用される
100px	-30px	X(100) + Y(-30) = 70px	ネガとポジの時は、相殺されない
-100px	-30px	X = -100px	両方ネガの時は、絶対値の大きい方が採用される

* * *
参考：
marginの相殺
CSSでレイアウトするなら絶対覚えておきたいブロックレベル要素のクセとかいろいろ