Chris Coyier CSS-Tricks

Preventing a grid blowout  ↦

Chris Coyier on CSS-Tricks:

Say you have a very simple CSS grid layout with one column fixed at 300px and another taking up the rest of the space at 1fr.

That’s somewhat robust. That 1fr column will take up any remaining space left behind by the fixed 300px column. It’s true that the auto value would do the same, but auto isn’t quite as robust since it’s size is based on the content inside.

Chris explains something here which may look pretty simple, but would’ve taken me hours to debug. The distinction he makes between the 1fr and auto defined column is game changing on its own.


Sign in or Join to comment or subscribe

Player art
  0:00 / 0:00