Grid Layouts sind eine weitere Macht der CSS, die es Ihnen ermöglicht, komplexere Seitenstrukturen zu gestalten. Grid besteht aus einer Reihe von Spalten und Zeilen, in denen Sie Ihre Elemente positionieren können. Hier ist ein Beispiel, das eine einfache Einkaufsliste mit CSS Grid zeigt. Beachten Sie, dass Grids mit Flexbox kombiniert werden können, um noch flexiblere Layouts zu erstellen.
.grid-container {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
grid-gap: 20px;
}