近頃の、とあるR。

サンプルHTMLの表示に於いて、
IE8、Firefox3、Safari3(chromeも)では、

この画像のように、ボックス間に隙間が空いてしまいます。
IE6,7、Opera9ではボックスAとボックスBは密接します。
ボックスAは、marginもpaddingも（borderも）なし。
Aの子ボックスのbottomにmarginが入っています。

名だたるモダンブラウザがほぼ全滅

本来？なら、ボックスAとBの隙間はボックスAの背景色で埋められるのが直感的なレンダリングです。
ところが、モダンブラウザと名高いIE8、gecko、webkitがボックスAの背景をキャンセルしてしまいます。
うーむ。ここまで、そろいもそろってですと、流石にバグではなく仕様なんでしょうね(´・ω・｀)

親ボックスのpaddingにダミー値をいれて対策

良くある実例では、ボックスAが id=”main” ボックスBは id=”footer” で共にダミー的コンテナボックスだったりで、余白系の値は０にされていることでしょう。
大抵の場合は無調整で問題ないのですが、
（無駄に）複雑な多重背景で、うかつなズレが許されない場合がままあります。
そんな際の、margin、padding、時にはborderで、ごまかす調整するでは、キャンセルされるボックスAのbottomにpaddingの値を与えてやるのが良さそうです。