Home > CASTAGE | トラブルシュート > IEで画像に隙間ができる

IEで画像に隙間ができる

Web制作の動作確認は基本的にFirefoxで行っているのですが、余裕こいて最終的にIEでテストをすると痛い目に遭う。

今回はFirefoxでは正常に見えたテーブル内の画像達ですが、IEだとスキマスイッチ。

こちらはFirefoxでCASTAGEのトップページを開いた時の画像。

Firefoxで表示

Firefoxで表示

こちらはIEで開いた時の画像。

IEで表示

IEで表示

何のことはない、CSSでimgの属性にvertical-align:top;をインしてあげればよい。

CASTAGEで使用しているCSSのimgはこちら

PLAIN TEXT

CSS:

  1. img {
  2. border:0px;
  3. vertical-align:top;
  4. }

原因は画像もインラインなのでそのままで使うとbaselineが適用されているので下がちょっと空いてしまうからだそうです。

コメント:2

****** 11-05-15 (日) 18:22
このコメントは管理者の承認待ちです
****** 11-08-04 (木) 22:40
このコメントは管理者の承認待ちです
コメントフォーム
Remember personal info

トラックバック:0

このエントリーのトラックバックURL
http://castage.net/blog/ie_css/trackback/
Listed below are links to weblogs that reference
IEで画像に隙間ができる from ホームページ製作・グラフィックデザインならCASTAGE：キャストエイジ｜ブログ

Home > CASTAGE | トラブルシュート > IEで画像に隙間ができる

固定ページ
最近の投稿
カテゴリー
アーカイブ
タグクラウド
検索
フィード
メタ情報

Return to page top