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!