Boxes not responding to layout change

Hi!

Could someone tell me what I’m doing wrong. The quick stack I’m using doesn’t change correctly when I go to different screen sizes. Not sure if I’m missing something or if there is a bug? Can someone help me when they get a chance, would really appreciate it!

You can see here that the 4 boxes are kinda messed up when you go to a phone size, they should just stack right on top of each other.

https://preview.webflow.com/preview/natalias-marvelous-site-cf770a?utm_medium=preview_link&utm_source=designer&utm_content=natalias-marvelous-site-cf770a&preview=c6ec4ea0d6247c4c5af3e07b03ee876c&pageId=654d2fa1079352a67db54512&workflow=preview

You need to edit the quick stack on the smaller breakpoint sizes, click where it says 1FR and then delete the extra columns. Once your quick stack only has 1 column on mobile it should stack them all vertically.

If you’re referring to the Team section you’ll need to remove the 374px left and right margin before making the above change to your quick stack as the margin isn’t allowing things to resize responsively.

Thank you so much! I’m just having an issue with the stacking on the iphone. I did what you said and it worked for the boxes up top but it’s not working for the team section, any suggestions?

Try resetting the Position of the Quick Stack 1 element on the Desktop breakpoint to Static.

Here’s how it looks on mobile.

You’re an angel, thank you so so much, that fixed the issue!

I tried applying the same logic to the home page quick stack with all the drop-down options but for some reason, it continues to overflow past the margins, any idea?
https://preview.webflow.com/preview/natalias-marvelous-site-cf770a?utm_medium=preview_link&utm_source=designer&utm_content=natalias-marvelous-site-cf770a&preview=c6ec4ea0d6247c4c5af3e07b03ee876c&workflow=preview

A couple things. The chevron arrow for your accordions all have a 200+ pixel left margin, you should apply a class to all of them and reduce the margin to 0.

Then your image and button below the accordions section also have left margins, reduce these to 0 as well.

Caitlin, you are an absolute god send! Thank you so very much!

Hi Caitlin,

You’ve been so helpful I was wondering if you could help me figure out one last thing. Do you know how to make a heading in a drop-down clickable? It’s also acting kinda wonky on the smaller sizes when I tried to add a link.

https://preview.webflow.com/preview/natalias-marvelous-site-cf770a?utm_medium=preview_link&utm_source=designer&utm_content=natalias-marvelous-site-cf770a&preview=c6ec4ea0d6247c4c5af3e07b03ee876c&pageId=654d2fa1079352a67db54512&workflow=preview

I would like the “How We Serve” to lead us to the How we Serve page and still have the drop-down menu lead to our main services.

Thank you so so much!