css H2タグをH3タグと同じように見えるようにするにはどうすればいいですか？（難しいと判明しました）

Question

私の問題の解決策を探しています。

私は自分のブログのために新しいwpテーマをコーディングしています。

私が遭遇した問題は、ホームページとカテゴリページ（投稿につながるリンク）に投稿するリンクがあります。ホームページ上では、このリンクにはh3タグ、流動性の原因（h1のウェブサイト、h2のカテゴリのタイトル、h3のポストタイトル）があります。今カテゴリページで私は異なった流れを持っています（h1カテゴリ名、h2 post tittle）。問題はデザインが賢明で、同じものに見えるはずです...私の挑戦は、カテゴリーページのh2をホームページのh3と同じように見せることです。

それほど簡単ではありません。まず第一に、より小さなフォントを使用する必要がありました。私にとっては変だけど、私はh2 0.8emとh3 1emを設定しなければならなかった。この問題に対処する正しい方法ですか？そして、私は両方の見出しに余白0があったにもかかわらず、いくつかの奇妙な間隔が入って来た...

これは最終結果です、h2はh3に見えるようになりました（より小さなフォントとh2 、マージンボトムは3px以上）。

私の質問は、これがこの結果を達成するのに大丈夫なのですか？または私の一般的なリセットファイルに何か問題がありますか？物事を明確に表示するための画像を含む

：

http://imageshack.us/photo/my-images/33/unled1hg.jpg/

そして、あなたは2つのページが住んで見ることができます： http://artvard.com/category.html http://artvard.com/main.html

Answer 1

emにフォントサイズを指定すると、親要素のフォントサイズに基づいているため、タグの親が異なる場合、同じ設定では実際のサイズが異なる可能性があります。

h3用に特別に設定されたスタイルがある場合は、h2用にそれを繰り返すか、継承された値に従って調整することができます。

h3のスタイルがブラウザのデフォルトに基づいている場合、h2を同じに見せることはできません。あるブラウザでh3のデフォルトと同じに見えるh2のスタイルを作ることができますが、別のブラウザではh3のデフォルトは違って見えます。

Answer 2

最も良い解決策は、H2とH3の両方でCSS resetを使用し、それらを最初からスタイリングすることです。それ以外の場合は、ブラウザごとに異なる行のフォントサイズなどのプロパティが常に存在します。

Answer 3

問題は、emsが親要素から継承されているためです。それが役に立ったら、パーセンテージのように考えてください。あなたが設定されている場合

したがって、h2は1EMに、あなたは0.8emであなたのスタイルは、#content DIV内のすべてが0.8emに表示されます<div id="content">などのコンテンツ領域を持っています。 h2の要素がの#contentの内部にある場合は、これは以前に0.8emと定義されていた1emのサイズになります。つまり、小さく見えます。

ほとんどの最新のブラウザでは、ページのサイズを増やすことができるため、ems over pxを使用するための引数は弱いです。ですから、私はpxに切り替えるか、あなたの継承を慎重に調べることをお勧めします。