Flydende layout 7 / 17

Lav tre kolonner, hvor den første og sidste kolonne optager lige meget plads vha. 1fr. Angiv en rækkevidde mellem 0 (min) og 300px (max) via funktionen minmax() til den midterste kolonne. .box-1 skal begynde på kolonne-linje 1 og slutte på kolonne-linje 4, og .box-2 skal begynde på kolonne-linje 2 og slutte på kolonne-linje 3.

Træk i vinduet med dine bokse (nederst i højre hjørne ) for at se, hvordan grid’et opfører sig i forskellige størrelser. .box-2 skal forblive 300px i bredden, indtil der ikke er mere plads, hvorefter den skal følge forælder-containerens bredde (se reference).

Hints
  • grid-template-columns
  • minmax(<min>, <max>)
Har du brug for hjælp? Lær mere om minmax()
.box-1
.box-2