10 modern layouts in 1 line of CSS がすごい

2020-07-31

今月 Google の YouTube チャンネルで公開された動画ですが、とても勉強になりました。

自分が知らなかったやつ、詳しくなかったやつを書き出すと、

  • #01 place-items: center;
  • #02 flex: 1 1 150px;
  • #09 width: clamp(23ch, 50%, 46ch);
  • #10 aspect-ratio: 16 / 9;

です、どれもめっちゃ使えそうです。

ちなみにブラウザの対応状況は以下のとおりです。

調べた感じでは aspect-ratio 以外は業務でもいけそうです、今時 IE に対応する必要があるプロジェクトもそうそうないでしょうし。

ただ個人的には aspect-ratio を一番使いたかったので、ちょっと残念です。

© 2018 kk-web