My grid has gone haywire

I’m trying to implement a grid for the first time. The grid came together well on desktop, but as soon as I switch to tablet or smaller, it appears to have lost its mind. The grid was defined with 3 columns by 4 rows. I also defined a few areas.

On tablet view, although the grid setup still references the correct amount of columns and rows, the visual editor shows 5 columns by 6 rows.

https://preview.webflow.com/preview/joes-super-cool-site?utm_medium=preview_link&utm_source=dashboard&utm_content=joes-super-cool-site&preview=53239fc579f6e09c739b564acaa21ee7&mode=preview

Hi @joesnikon,

Please update your share/preview link as there is an error.

Best Regards,
~ Brandon

Okay, I generated a new code. I deleted the entire grid and started again, but I can’t for the life of me get it work responsively.

https://preview.webflow.com/preview/joes-super-cool-site?utm_medium=preview_link&utm_source=dashboard&utm_content=joes-super-cool-site&preview=2a484fb342c1c48df6f045c332bbfc94&mode=preview

Hi @joesnikon,

You mention your grid, but can you tell me where on your site the grid you are having issues with. Please provide direction on what exactly you are having issues with, on what page, where on the page, etc.

Best Regards,
~ Brandon

I think I got it all working. After hours after troubleshooting and clicking on every option on Webflow (all 2,637 of them) I think I figured it out. Instead of trusting the grid to just do its thing, I think I paralyzed it by placing so many size restrictions for my various elements.

Once I set most of my size settings to Auto, things started to snap in.

Thanks for checking in on me. I’m sure I’ll break something else today. Loving the platform.

1 Like