Safariのレンダリングエンジン「WebKit」の公式ブログにて、CSSグリッドレイアウトLevel 3で実装される予定のメイソンリーレイアウトの使用例が掲載されました。 Help us invent CSS Grid Level 3, aka “Masonry” layout | WebKit https://webkit.org/blog/15269/help-us-invent-masonry-layouts-for-css-grid-level-3/ メイソンリーレイアウトは下図のように、コンテンツがレンガや石の壁のように積み上げられているレイアウトです。コンテンツがページ上を滝のように流れていくためウォーターフォールレイアウトとも呼ばれています。 メイソンリーレイアウトを使用することでさまざまなアスペクト比のコンテンツをきれいに配置したり、ページをスクロールするときの自然な読み
![WebKit公式ブログにてタイル状にアイテムを配置するメイソンリーレイアウトのデザイン例が掲載される](https://cdn-ak-scissors.b.st-hatena.com/image/square/c124a9458b35f83d27456daff802fea7f3fe1f0b/height=288;version=1;width=512/https%3A%2F%2Fi.gzn.jp%2Fimg%2F2024%2F04%2F25%2Fcss-grid-level-3%2F00.png)