Streaming live at 10am (PST)

Dynamic grid auto-fit not working

Hi everyone

I’m trying to create a grid that dynamically adds a new row so that it doesn’t overflow on smaller screens, like this example: https://my-orange-and-blue-blog.webflow.io/

In my case I can’t use breakpoints, because the grid overflows on the desktop breakpoint when making the viewport smaller.

Unlike the example my grid elements have a specific size, if that matters.

To illustrate what I mean, the grid should display all columns in one row on desktop:

But if the desktop viewport is too small for the grid width, a new row should be added so that the grid doesn’t overflow like this:

Any suggestions are welcome!

Here is my site : https://preview.webflow.com/preview/grid-test-599754?utm_medium=preview_link&utm_source=designer&utm_content=grid-test-599754&preview=376d872d824a1aa593aec79b01d6fd1c&mode=preview