margin-top not working with：

Question

クラスの：before擬似要素を使用してコンテンツを挿入しました。私はmargin-topを使ってこのコンテンツを配置しようとしていましたが、firefoxは単にプロパティを無視しています。コードは次のとおりです：

.bef { 
    line-height: 2em; 
    white-space: nowrap; 
    font-size:24px; 
    display: block;  
    } 

.bef:before { 
    display: block; 
    margin-top:2em; 
    padding: 0; 
    color: #666666; 
    content:"Hello";  
    } 

Firefoxがマージントップのプロパティを無視している理由が分かりますか？

EDIT：マージントップは完全に無視されているが、マージン下： - X EMが働いていると私は移動することができる午前：

Answer 1

ダークーZが正しいと思われます。

http://jquery.nodnod.net/cases/577

仮に、最初の2つのテストケースは（<hr>で区切られた）彼らは（FF3.5 /マック経由）のGeckoで行うれ、同じようにレンダリングする必要がありますが、WebKitが（経由Safari4/Mac）を:beforeをレンダリングインラインで:afterのセグメント。 3番目のテストケースは、生成されたコンテンツがブロックされるために、現在Webkitがトリガー要素をブロックする必要があることを暗示しているようです。

仕様が正しいかどうかは不明です。どのレンダリングエンジンの動作が正しいかを調べるためにwww-styleに関する質問を提出し、不適切なレンダリングエンジンでバグを報告して、将来のバージョンで修正されるようにする価値があります。私のコードをテストケースとして自由に使用してください。

Answer 2

周りの要素も.bef表示ブロックを作ってみる前に？前のブロックの要素がブロックする必要があるので、マージントップを聞くことができると推測してください。