
IE8が対応したCSS 2.1の機能:displayプロパティなど3種類を解説
今回は、IE8が対応した次の3つのプロパティについて確認していきたい。
- display
- list-style-type
- white-space
これらのプロパティには古いIEも対応しているが、CSS 2.1で定義されたすべての値に対応していたわけではなかった。IE8では定義された値を一通りサポートするようになっている。そこで、今回はこれらのプロパティの値のうち、IE8が新しくサポートしたものについて確認していきたい。
なお、新しく対応した機能を利用するにはIE8のStandardsモード(標準準拠モード)で表示する必要がある。Standardsモードや互換表示ボタンについては第2回の記事「IE8のレンダリングモードと互換表示」を参照してほしい。
displayプロパティ
IE8はdisplayプロパティの値のうち、古いIEで未対応だったrun-inとinline-block、テーブル関連の値に対応した。ここでは、それぞれの値についてどのように対応したかを確認していきたい。
なお、displayプロパティについて詳しくは「Firefox 3が対応したdisplayプロパティの値(1)」を参照してほしい。
run-in
「display:run-in」と指定するとrun-inボックスを構成し、後に続くblockボックスに含めて表示される。

dt{ display: run-in; border: solid 2px red; } dd{ margin-left: 100px; background-color: yellow; }
- 挨拶
- 「おはよう」「こんにちは」「こんばんは」「おやすみ」など。
※ブラウザで表示を確認する
inline-block
「display:inline-block」の指定は、古いIEでもインライン要素に適用した場合は機能していたが、IE8ではブロック要素に適用した場合も機能するようになった。
たとえば、次のように「display:inline-block」と指定すると

div{ display: inline-block; background-color: #00aaff; width: 200px; text-align: center; padding: 5px; }
おはようこんにちは
※ブラウザで表示を確認する
テーブル関連の値
IE8はdisplayプロパティに用意されたテーブル関連の値に対応した。テーブル関連の値は以下の7種類となっている。
- table
- inline-table
- table-row
- table-cell
- table-row-group
- table-header-group
- table-footer-group
たとえば、次のサンプルはキャプションも含めてすべて

.table{ display: table; border: solid 3px #00aaff; } .caption{ display: table-caption; text-align: center; } .tr{ display: table-row } .td{ display: table-cell; border: solid 2px #aaff00; padding: 10px; } .thead{ display: table-header-group; background-color: #ffffaa; }
ひらがなの表…略…あいうえお※ブラウザで表示を確認するなお、テーブル関連の値について詳しくは「Firefox 3が対応したdisplayプロパティの値(3) - inline-table」を参照してほしい。
list-style-typeプロパティ
- 新着記事
- 特集
- ブログ
- 企画特集
-
クラウドバックアップお悩み相談室
-
下した決断は「ハイブリッドへ」
-
意識してますか?PCの「信頼性」
-
AI活用が激変する新たなインフラ
-
働き方改革は身近な「改善」から
-
新時代にはゼロトラストが不可欠
-
レガシーなインフラ設計を見直す
-
Why ワークプレース?
-
サブスクモデルのSaaSで業務改善
-
変化への対応はリアルタイム経営で
-
働き方改革にモニターが有効なワケ
-
どこまで可能?企業を究極の自動化
-
データ活用を加速するエコシステム
-
攻めと守りのクラウド活用とは!?
-
特集:ビジネスを止めるな!
-
分析されたデータを活用できるか?
-
ITシステムは永久のβ版思考で
-
Office 365にもFWが必要?
-
特集:ポスト2020時代のCX再考
-
2020年代を勝ち抜くインフラ
-
実現まで10年「ゼロトラスト」
-
講演レポ:ポスト2020時代の基盤
-
ウルトラ帳票文化を乗り越える!
-
レポート:NWセキュリティの未来
-
DX成功の鍵はセキュリティにあり
-
「脱レガシー」なくしてDXはない
-
ビジネス成功の砦はここにあり!
-
RPAがニガテなExcelをどう使う
-
ビジネスの大きな転換点で勝者に!
-
働き方、生産性を根底から底上げ!
-
明治創業の鉄道企業がAWSに挑戦
-
隗より始めよ
Cookieなどの設定や使用の詳細、オプトアウトについては詳細をご覧ください。
[ 閉じる ]