A basic usage of “fr” CSS UNIT

This topics is related to the CSS grid layout.

We can create a grid with fixed track sizes — using pixels for example. This sets the grid to the specified pixel, which fits to the layout you desire. You can also create a grid using flexible sizes with percentage.

But when we do using percentage or pixel, like

But it’s not serving our purpose, so we want something different. And here it comes the unit “fr”. For our example