オペラとFirefox/Chromeのミスアライメントの問題

Question

私はCSSを学んでいて、この非常に基本的なページを思いついたので、タイトルと<li>セクションの間に<hr>またはその他のセパレータを追加しようとしました。 Chromeは、スクリーンショットに表示されるページ（見えないDivの一種）に矩形を追加するようです（select-allを使用）。タイトルの下にあるテキスト/オブジェクトをすべてのブラウザで正しく整列させるにはどうすればよいですか？

スクリーンショット：img194.imageshack.us/img194/9017/css00.jpg

サイト/ソース：解決しようhttp://dl.dropbox.com/u/23916103/layout1.html

---

：どうやらこれはオペラ、上の回転のdivのバグでした私のタイトルテキストの高さを0に設定して透明な背景を持つようにしました。何らかの不明な理由でOperaは0を有効な高さに置き換えました。

はここにあなたがバグ

答えのためのthnxを起こし、ゼロ高さのdivを見ることができる上screenie（http://img6.imageshack.us/img6/4315/divvs.jpg） です。

Answer 1

Firefoxとchromeが正しくレンダリングされているようです。 Operaはデフォルトのマージンとは異なって論じているようです...あなたはnormalize.cssのようなものを試してみるべきです。そのスクリーンショットで選択したものは、体の一部に過ぎません。 chromeのinspect-elementを試してください。そこに不思議なdivはありません！