How the CSS minmax() Function Works

One incredibly useful new feature introduced with the CSS Grid Layout Specification is the minmax() function. This function opens the door to us being able to write much more powerful and succinct CSS by allowing us to set, as a value for a grid track, a function including both a minimum and maximum value.

Using minmax() – combined with repeat() – it’s possible to create responsive grid designs without the use of any media queries.

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

How the CSS minmax() Function Works →

Elsewhere , , ,

Leave a Reply

Your email address will not be published. Required fields are marked *