使おう、CSS Grid

全2回

CSS Gridはレイアウトメソッドで、ほとんどのモダンブラウザがサポートした「今」使える技術です。条件は整ったので、実装の経験値を蓄積する段階です。そこでピクセルグリッドでのケースをいくつか紹介します。

第2回 CodeGridの著者一覧:CSS Gridの自動配置で書き直す

CodeGridの著者一覧ページはもともとメディアクエリーとFlexboxを用いてレイアウトしていました。それをCSS Gridで書き直してみることに。するとさまざまなメリットが見えてきました。

第1回 押さえておきたい事前知識

CSS Gridのケースを紹介する前に、これまでの実装でわかってきたCSS Gridを使う際に留意しておかなければいけない事項をまとめました。たとえばHTMLの構造などもCSS Gridと密接に関わりあっているのです。