How to stack grid items on mobile view?

Hey there! We’re having trouble mobile-optimizing our website. Specifically, could you provide instruction on how to stack the grid items to where they are on top of each other on mobile view?

Here is our read-only link: https://preview.webflow.com/preview/dreamsuccess?utm_medium=preview_link&utm_source=designer&utm_content=dreamsuccess&preview=1e0525815b45be0d1086b379ddcc7ab1&mode=preview

Thanks!


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Hi Ryan,

All you have to do is set the grid to by 1 column. You can do this by editing the grid and deleting columns 2, 3, 4 etc. The content will just push down and create a column for you.

You can also typically just set the grid element to display block.

Hi, I’m having the same issue. Tried deleting to just one column but it stacks the boxes in a sequence that does not look correct i.e. text is in the wrong places/boxes. I’m using divs in each grid box, would that make a difference?