Web Development / CSS

Lesson 13 of 30

CSS Grid

Grid lays things out in rows and columns at the same time. repeat(auto-fill, minmax(220px, 1fr)) makes a responsive card grid in one line.

.cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 16px;
}