Firefox（クロム+サファリで動作）+マイヤーズリセット

Question

私の友人は私のウェブサイトの新しいデザインを手伝ってくれましたが、それ以来フルタイムの仕事を得ています。ウェブデザインは私の強い訴訟ではなく、すべてのブラウザで機能するようにはできません！

今、私のウェブサイトはChromeとSafariでよく見えます。しかし、（マイヤーズ・リセット）私はCSSは、この問題を解決するためにリセット異なるしよう/研究していたFireFoxの にhttp://dl.dropbox.com/u/22866203/sb%202/speedbump.html http://dl.dropbox.com/u/22866203/sb%202/speedbump.css

が壊れているが、これはChromeとSafariのページも破損しているように見えました。

どのような提案も大歓迎です！

Answer 1

リセットなしで起動した場合、リセットは役に立たなくなります。特に問題は、あなたがフロートをクリアしていないことです。これを解決するには、次のようにします。

#social-media, hr { clear: both; } 

Btwの場合、イメージとその他の多くの警告にはエラーがあります。火か虫やdevtoolsをチェックしてください。

Answer 2

firebugであなたのサイトをちょっと混乱させていたので、いくつかのdivにプロパティを追加すると、float: leftはクロムのように見えるようにサイトを配置することに気付きました。
firefox for firefox（素晴らしいツール）をダウンロードして、浮動小数点のdivを正確にどのように配置するかを調整します。

希望します。

Answer 3

#wrapperオーバーフロー与える：隠されたのと、前と後のdivからマージントップを外します。

Answer 4

問題は、本文テキスト（左）と緑色のボックス（右）に要素をフローティングしていて、親が浮動していないことです。つまり、浮動要素が全体の高さに影響しません。また、hrを使用せず、代わりに枠線を使用してください。

http://dl.dropbox.com/u/33811812/stackoverflow/speedbump/Speedbump.html

パスは今、私のフォルダへの相対的であり、あなたが戻ってそれらを変更する必要があります。

Answer 5

IDはユニークである必要があります（#wrapper）。上記の画像から4つのインスタンスが表示されます。

代わりにクラスを使用して再利用できます。

.wrapper:after{ 
    visibility: hidden; 
    height:0; 
    display: block; 
    clear:both; 
    *zoom:1; 
    content: '.'; 
}