0Pricing
CSS Academy · Lesson

repeat() and minmax() in Grid

Generate multiple grid tracks and define flexible size ranges using repeat() and minmax().

repeat() in Grid Context

repeat(count, track-size) is a CSS Grid function that generates multiple track definitions without repetition. It works inside grid-template-columns and grid-template-rows.

repeat() with Fixed Count

Create 4 equal columns:

.grid {
  grid-template-columns: repeat(4, 1fr);
  /* equivalent to: 1fr 1fr 1fr 1fr */
}

All lessons in this course

  1. calc() for Dynamic Calculations
  2. min() max() and clamp() for Fluid Values
  3. repeat() and minmax() in Grid
  4. color-mix() and relative color syntax
← Back to CSS Academy