2010年05月27日

line-height: 1でセルから文字がはみ出して見えない。

掲示板用のデザインで、
スレタイトルテキストの下部に少し余白とボーダーをつけ、
その下側に10pxほどの空白、
で、カテゴリー名や投稿日時などの細かい文字を
で並べるレイアウトをしていました。

が、

なぜか内のテキストの上部1〜2pxだけ
削れたように見えなくなる事例が発生。

(確認 windows IE6)





調べていくと、
に対して施していた「line-height: 1」が
問題のようで「line-height: 1.4em」にして対処しました。

【まとめ】
line-height: 1は、意図しない余白がテキスト上下にできるのを防いでくれますが、
テーブルセルでのline-height: 1は要注意。
posted by CSSベースでのHTML(XHTML)レイアウト入門講座<polka> at 10:02 | Comment(1) | TrackBack(0) | CSSベースのHTMLコーディング | このブログの読者になる | 更新情報をチェックする

人気ブログランキングへにほんブログ村 デザインブログ Webデザインへ

この記事へのコメント
IE6のline-heightは特にあほたれですからね〜。
Posted by 2dreams at 2010年05月27日 10:45
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

※ブログオーナーが承認したコメントのみ表示されます。

この記事へのトラックバック
×

この広告は90日以上新しい記事の投稿がないブログに表示されております。