https://netguide.jp/en/tags/grid/Recent content in Grid on KaisekukunHugo -- gohugo.ioenKaisekukunSun, 15 Mar 2026 12:00:00 +0900https://netguide.jp/en/web/css-subgrid-layout-guide/Sun, 15 Mar 2026 12:00:00 +0900https://netguide.jp/en/web/css-subgrid-layout-guide/<img src="https://netguide.jp/img/thumbnail/css-subgrid-layout-guide-en.png" alt="Featured image of post Understanding CSS Subgrid Layout for Modern Design" /><p>CSS Grid revolutionized how web layouts are structured. However, a common challenge remained: aligning nested items (grandchild elements) inside parent Grid Items to the main grid lines.</p> <p>This was resolved with the introduction of <strong>CSS Subgrid</strong>, a specification update for CSS Grid Layout. This article explains the fundamentals of CSS Subgrid and how to apply it to common layout problems like card lists.</p> <hr> <h2 id="1-what-is-css-subgrid">1. What is CSS Subgrid? </h2><p>Traditionally, only direct children of a Grid container can be positioned along the defined grid tracks. When you declare another grid inside a Grid Item, that nested grid is completely isolated from the outer parent grid.</p>