CSS grid doesn't work with more than 3 elements

[fabienDM (de Maestri)]

Hi everyone !

I just started to learn building websites with webflow, and I’m block with css grid.

I have a basic grid of 4 column, which take all the width. When I put the 4th div in the last column, there is a big space on the right. I can’t explain why.

With 3 divs, placed into the 3 first columns :

When I add a 4th columns, the css grid becomes :

Everything go back to normal when I add another column :

Thanks for helping me !

---

Here is my site Read-Only: https://preview.webflow.com/preview/fabiens-business-starter-801b68?utm_medium=preview_link&utm_source=designer&utm_content=fabiens-business-starter-801b68&preview=987907f1dde9a7888f587f471d03ccea&pageId=5fac46e9534f1321eedaaa75&mode=preview
(how to share your site Read-Only link)

[Stan (justAnotherDeveloper)]

Hi @fabienDM and welcome. I can’t recreate your issue as for me everything works as expected

[fabienDM (de Maestri)]

Hi Stan, Is it a way to reset everything ? Maybe it’s something inherited.
I already tried on a fresh new page.

[fabienDM (de Maestri)]

Arf, this is the same even with a new project.

4 div

Everything goes back to normal, when I remove the 4th div

[fabienDM (de Maestri)]

EDIT : I can’t reproduce this bug on safari. However I am on the last chrome version. Any idea ?

[Stan (justAnotherDeveloper)]

This is image from your link and all seem to work in Safari or Chrome

[fabienDM (de Maestri)]

Hi!

Can you try on this link https://preview.webflow.com/preview/fabiens-business-starter-801b68?utm_medium=preview_link&utm_source=designer&utm_content=fabiens-business-starter-801b68&preview=987907f1dde9a7888f587f471d03ccea&mode=preview please ?

Because I have that :

[Stan (justAnotherDeveloper)]

[fabienDM (de Maestri)]

Hum, is it the same link ? Because on my picture you can see 4 div. Here you just have 3.

[Stan (justAnotherDeveloper)]

Yes as you said that you have problem with 3 divs. 3 or 4 still works for me without any shrinking problem.

but here we go with 4

[fabienDM (de Maestri)]

Ok, so bad that you can’t reproduce

Thanks anyway !

[Stan (justAnotherDeveloper)]

You can try to start new project and delete this as there can be something what you have setup accidentally, but I really doesn’t have a clue as all is working for me.

[fabienDM (de Maestri)]

Me neither, it works well on my safari. I’m gonna investigate more. Thx !

[fabienDM (de Maestri)]

It was a zoom problem

[ACarchitecture (Charles C.)]

Hello there,

I do have exactly the same issue… I’m working on chrome…

-CC