Flex BoxがIE対応していた

Flex Box、死ぬほど便利そうだけどIEで使えないしー! と思っていたんですが、使える!使えるよ!

最初、ここ見て実装しました。

CSS3 でのレイアウトで使える box 系プロパティのまとめ | CSS Lecture


ここにIE10以上対応って書いてあるから鵜呑みにしたけれど、表示されず。

[CSS3] 横並びレイアウトを簡単に実現するdisplay:boxが便利 - YoheiM .NET


でも、結構詳しくわかりやすく解説してあるのであとでもう一回読んでおこう。

そして。このご時世さすがのIEも対応させていないわけないんじゃないの!?!?!?と必死こいて調べたら。
ありました。載ってました。MS公式に載っていました。

Internet Explorer 10 の可変ボックス (


これらをまとめると

[code]div{
width: 100%;
display:-ms-flexbox;/ IE /
display:-webkit-box;/ Safari,Google Chrome用 /
display: -moz-box;/ Firefox用 /
}[/code]

これでボックスの中の要素が 高さが揃った状態でぴしゃっと横に並びます!便利!

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です