IE11でdisplay:table-cell;を当てたインライン要素の高さがない

  • このエントリーをはてなブックマークに追加

IE11でdisplay:table-cell;を当てたテーブルにネストされたインライン要素に高さが出ずに画面が崩れていた時の対応。

`<div style=”display:table;”>
<span style=”display:table-cell;”></span>
<div style=”display:table-cell;”></div>
<span style=”display:table-cell;”></span>
</div>`

ざっくりとメモするとというようなHTMLだったのですが、テーブルの中身のスタイルが崩れていました。

そこで、親要素にtable-layout:fixed;を設定してから確認すると、スタイルの調整が可能でした。

具体的な内容には触れていませんが、ターブルで表示が崩れたときは、親要素にtable-layout:fixed;を適用すると何とかなるかもしれません。。

  • このエントリーをはてなブックマークに追加

SNSでもご購読できます。

コメントを残す

フォロー

メールアドレスを記入して購読すれば、更新をメールで受信できます。