シンプルなグリッドレイアウトサンプル集

Microsoft edgeがベンダープレフィックスなしのグリッドレイアウトに対応し主要ブラウザは出揃いましたね これによりedge専用に糞みたいなベンダープレフィックスをつける必要がなくなったのと、付けてもedgeでは対応できなかったgrid-template-areasが使える様になりグリッドレイアウトが簡単に組み込める環境か整いました グリッドレイアウトどころかCSS自体詳しくもありませんが、簡単なグリッドレイアウトのベースをメモ代わりに作っておきます

1カラムレイアウト

2カラムレイアウト

右カラム分割した2カラムレイアウト

グリッドメニューのレイアウト