CSSに追加されたflex

css3-1今回はFlexboxのメモ

CSSに新しく追加されたFlexboxはCSSに高さを自動調整させる機能をもっててフロートの代わりになるプロパティが追加されました。

今まではpositionやfloatで調整してたバナーの位置がFlexboxで楽に調整できるようになりました。

親要素にDisplay:flexを追加させるだけで子要素に影響がでます。

もちろん、フロートの代わりになることもあって横並びは持ちろん片方を大きめに範囲を取る事もできる!!

ただブラウザのバージョンが結構厳しい!

IE だと10以下は効かないという厳しい条件になってますが、CSSに一行追加で出来るのは製作者側ではとても嬉しい!
対応してないブラウザだと -webkit- を使って記述しないといけないのが大変な所です。だけど近い未来、近い未来ブラウザもEdge chromeの使う割合が増えれば普通に使えるようになる!

詳しい内容はこちらから確認できます。

使い方解説ページ

 

関連記事

  1. 映像編集もたまにやります

  2. Google マップの上位表示の要因メモ

  3. AdobeのHTML5&CSS3入門

  4. 「SlowCop」と「Page Speed」

  5. AMP(Accelerated Mobile Pages)の今後に注目…

  6. 外部コメントシステム DISQUS