CSS grid - unequal columns problem

Design help General
1

Hi Webflowers,

I have problem with new CSS grid. I have already worked with it and love how it allows us to create better layouts but I came to the bug I don’t know how to fix.

I have simple 4 columns 1 row grid and I have no idea why the last column is wider comparing to others. The right column is bigger although element inside grid is completely the same as in other columns.

Please see the picture.

20
202496×996 347 KB

Unfortunately I cannot provide you with link to the website as client doesn’t approve it.

Hope to get it solved with you!

Best,
Michal

2

Hey @Michal_Maciejewski, how are you doing?

So, that’s an intended behavior of the FR unit, it’s a Fraction of the remaining space. So it’s dependent on the content size. But you are not stuck with FR, you can use other units like percentages if you want to.

the example bellow shows the same 8 column grid using FR (top) and % (bottom).

41
413104×1978 496 KB

3

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