css - ナビゲーションのハイライト要素

Question

地獄、ナビゲーションの他の要素から特定の要素を強調表示する必要があるナビゲーションを作成しています。フォントのサイズを大きくする場所で強調表示された css クラスを作成しました。しかし、テキストは小さいテキストと同じ高さにありません。

#navigation .bar a.highlight{
font-size: large;
}

次のようになります。ここに画像の説明を入力

申し訳ありませんが、私はcssとhtmlが初めてで、簡単な解決策だと思います。

私のコードを見てください http://jsfiddle.net/FcbJv/

score 1 · Accepted Answer

を追加する必要がありline-heightます。

これを試して：

#navigation .bar a.highlight {
    font-size: large;
    line-height: 12px; /*Same as your font-size for normal items*/
}

ページのフォントサイズは 12px であるため、line-heightof12pxは垂直方向の中央揃えになります。font-size を変更する場合は、必ずline-height.

score 1 · Accepted Answer

CSS で物事を垂直方向に整列させることは、気が狂いそうなことの 1 つです。

line-heightリスト項目を改善してみてください:

line-height: 16px;

また、ブラウザーごとに異なる可能性があるためfont-size、を使用するのではなく、必要なを具体的にするようにしてください。large

3 に答える 3