ようこそゲスト さん ユーザー登録 ログイン

スタイルシートのline-heightに関する質問です。

<img src="Images/mark.gif" width="17" height="15" />はてな<br>
<img src="Images/mark.gif" width="17" height="15" />はてな<br>

このように画像が含まれている行にスタイルシートで「line-height:1.6;」のように指定するとFirefox2.0やOpera9.24ではきちんと行間が空くのですが、IE6.0では設定が反映されません。

IE6.0でもきちんと行間が空くようなスタイルシートの記述方法はありますでしょうか？ スタイルシートのline-heightに関する質問です。 <img src="Images/mark.gif" width="17" height="15" />はてな<br> <img src="Images/mark.gif" width="17" height="15" /.. を含むブックマークはてなブックマーク - スタイルシートのline-heightに関する質問です。 <img src="Images/mark.gif" width="17" height="15" />はてな<br> <img src="Images/mark.gif" width="17" height="15" /.. - 人力検索はてな

  • pitagora あなたも質問に答えられます！ ウォッチリストに追加
  • 状態：終了 いるか
  • 回答数：1 / 5件
  • 回答ポイント：100ポイント
  • 登録：2007-11-10 11:12:53
  • 終了：2007-11-10 12:00:06
  • カテゴリー：インターネットインターネット ウェブ制作ウェブ制作

1 回答者：wizemperor 2007-11-10 11:45:38 満足！ 100ポイント

IEのバグです。

http://cssbug.at.infoseek.co.jp/detail/winie/b075.html


<p><img src="Images/mark.gif" width="17" height="15" />はてな</p>
<p><img src="Images/mark.gif" width="17" height="15" />はてな</p>

などとして、CSSを


p img { 
 padding: 0.3em 0;  /* IE 6向け */
 vertical-align: middle; 
} 

/* IE以外とIE7向け */
p>img {
 padding: 0;
}

のような感じにすればそれっぽくはなります。

(0.3は適度に調整)

質問者：pitagora 2007-11-10 11:59:30

どうもありがとうございます(^^)

無事IE6.0のほうにも反映させることができました。

とても丁寧に教えてくださいまして、ありがとうございました。

おとなり質問

この質問・回答へのトラックバックこの質問・回答へのトラックバック

[css][XHTML]　の入った要素でline-hightが無視されるバグ対策[css][XHTML]　の入った要素でline-hightが無視されるバグ対策 東京下町WEBクリエイターのおぼえがきBlog 2008-05-02 09:52:53
普段はがっつりコーディングすることが多いです。 liやdt・ddタグを用いて、TOPページのトピックス部分を制作していたら、 &lt;img&gt;の入った行...