Question about fractions in CSS Grid


Hi, guys, I’m learning fractions in CSS Grid now and I got stuck a little.
Here is the link to the exercise where I’ve found diffiiculty in:

And the question is: why did we use “1 fr 1 fr 1 fr” for rows? How did we divide "height: 500px;"so that each row took up the exact same fraction? Why couldn’t it be “2 fr 2 fr 2fr” for example?

And how are width and height divided in order to split values evenly between all rows and columns?

I will be very grateful for your answers because that’s very important to me! Thank you!


Simplest would be to say we have three rows. What’s to add to that? Just because it works out mathmetically to one’s arbitrary needs does not mean it has a practical application. Now you have to work with six rows, when three is all you want.


This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.