【CSS】レスポンシヴ対応のグリッド・システムを作ってみた。2.0【CSS】レスポンシヴ対応のグリッド・システムを作ってみた。ONZEhttps://on-ze.com/archives/2374HomeBlog【CSS】レスポンシヴ対応のグリッド・システムを作ってみた。Google今さら......という感じがしなくもないですが、レスポンシヴ対応のグリッド・システムを作ったのでシェアします。巷に出回っているものは横幅をピクセル単位で指定しているものが多いのですが、今回はパーセント単位で、ウィンドウサイズに合わせてフレキシブルに対応できるタイプのものを制作しました。サンプルをご覧ください。グリッド・システムボックス要素をグリッドに沿って配置したいとき、この[グリッド・システム]を使えば簡単に実装できます。スタイルシートの記述は以下のとおり。margin:0;}ちょっと長いように感じるかもしれませんが、セレクタが12個あるだけで、指定する要素自体は少なく、基本構造はシンプルです。