WEB標準をわりと正確に読む人気のブラウザとして、FIREFOXがある。
（グーグルクロムが出てからはそっちに人気が移動しそうだけど）

コーディングする際、まずはFOREFOXで確認しながらコーディングしていき、
最後にIEなどで確認をしたり、CSSハックを行ったりして、
調整する流れで作っている。

そんな信頼のFIREFOXもバグがないわけではない。

一番頻繁に遭遇するのが、入れ子（ネスト）構造になっている場合の子供にあたる<DIV>につけたmargin-topのバグだと思う。

<div id="box1">
        <div style="margin-top:20px;">
         あいうえーお
        </div>
</div>


こんな風にbox1というdivの中にmargin-top:20pxをつけたdivを作る。
本来ならば、box1の中で、20pxの余白ができたあとに、中のdivの内容が表示されるはず。

しかし、FIREFOXの場合、入れ子構造になった、子のmargin-topは親へと移ってしまう。

（表現が難しい）

つまり、box1の中には余白ができずに、box1そのものにmargin-top:20pxがついたのと同じ効果になってしまう、というもの。

これによって、枠の上の画像と枠の中身の画像でスキマがあいちゃったよ！とか
そういう事態が頻繁におこります。

解決法は簡単で、子のdivにmargin-topではなく、padding-topを使えばOK。

子のdivに背景画像が指定してある、などpadding-topが使えない場合は、
親のdivにpadding-topをつける、ということで解決するのがいいと思う。

僕の場合は、margin-topそのものを極力使わない、という癖でやっている。