Back to TILs

CSS Grid: minmax()

Today I learned about the minmax() function in CSS Grid.

.grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

This simple one-liner creates a responsive grid where columns are at least 200px wide but stretch to fill available space. No @media queries needed!