【CSSトラブル】　marginが無視される

CSSでコーディングしている際、
よく起こりうるトラブルとして、marginが無視される...

ということがあります。

例えば、

★HTML
＜div id="box1"＞
＜/div＞
＜div id="box2"＞
＜/div＞

★CSS
#box1{
　　　margin:40px;
}

#box2{
　　 margin:20px;
}

としたときに、



の、ように表示してほしいですが、



実際は、このように、上部分のmarginが、無視されて、
大きい方のmarginが優先されてしまいます。

これは、よく起こる事ですが、CSSの仕様のようなものなので、
あきらめるしかありません...。

背景などをつかっていなければ、
かわりにpaddingを使って、解決するといいと思います。


・似たような現象でこういうのもあります
【CSSトラブル】　marginが無視される2