IE7でdisplay:inline-blockを適用させる方法

ie-check

ie-check

IEチェックをしていてIE7ではうまくdisplay:inline-blockが効かないことってなかったですか?いわゆるIEのバグらしいんですが・・・。

サイト制作の過程でIEチェックすると思うんですがいつもこういったバグで時間がかかってしまうんですよね・・・。

なのでちょっと前のニュースでIEにセキュリティ上の欠陥が見つかったというニュースが流れた時は嬉しかったですね~。

WEB製作者は皆さんそう思ったんじゃないでしょうか?

ということはおいといて・・・・。

display: inline-block; ってfloat以外で横並びにさせるのにとっても便利ですが、IEでは上手く動かないことがあります。

IE7ではブロック要素に対しては全く効かないといったことがあります。

なのでそういった要素には下記のようにCSSで適用させてあげれば解決できると思います。

IE7でinline-blockを適用させる

*:first-child+htm 指定したい要素{
display: inline;
zoom: 1;
}

IEチェックの際の修正に役立ててもらえばと思います。

おすすめ記事

  • Pocket
  • LINEで送る
  • このエントリーをはてなブックマークに追加

コメントを残す




関連記事

PC・スマホでMedia Queriesを使って個別にCSSを読み込ませる方法(IE対策済み)
[IE対策]IEでfade効果などをさせた場合のPNG画像が透過されない(黒くなる)時の対処法
IE8以下でCSSで背景を指定したのに全く表示されない時にチェックしておきたいポイント
楽天ショップのリンク付きの縦バナーを設置する方法
Web制作者に必須のFTPクライアントソフト!FileZillaのメリットとは?
Webサイトを制作したらしておくべきチェックリスト
プレビューを見ながら簡単にスタイリッシュなグラデーションを作成できるCSS3ジェネレーター「Ultimate CSS Gradient Generator」
最近残りやすくなったな~って感じるWEB製作者の皆様!Clear Cashがめっちゃ便利と強く言いたい!
GitHubGistでWhoops.と表示された時の対処法
Sublime Text 2で自動補完してさらさら~っとHTMLやCSSを記述する方法
IEチェックでの修正に必須!IEの条件分岐&IE7やIE8などのCSSハック一覧をまとめてみました。
これだけあればOK! WEB制作で必須の簡単なURLを入れるだけでダミー画像が作れるWebサービス3選
Web制作のグラデーションに便利なCSS3ジェネレーターまとめ ※随時更新
WordPressをインストールしたディレクトリと同じ階層にindex.htmlがある時の開発準備TIPS
Web制作にルーチンワークに便利!Googleスプレッドシートを利用した簡単html生成法

Menu

HOME

 TOP