Mobile Responsive Layout Issues

Hey guys–

Hope all is going well, and thanks for reading this. Been working on this new site for estate planning and matching people with attorneys. The landing page for desktop has turned out quite nite, but now I’m having troubles with the “How It Works” section for the site.

I’ve been trying to figure out how to avoid overlapping with the sections, but can’t seem to get that together. I’ve built multiple sites on Webflow, and for some reason can’t get it fixed this time around.

Either I’ve been staring at this screen too long, or I just can’t identify the issue. A fresh perspective would definitely help.

Here are the links to preview:

https://preview.webflow.com/preview/tootles?preview=4c78df4502ed0e23f907d2d9fa5262b1

http://tootles.webflow.io/

Would appreciate any and all feedback! Looking forward to hearing from you.

Best,
Jose

I think the problem lies with all your sections having a fixed heights. (so do alot of other elements such as columns) Let your content flow and use padding and margins to achieve your spacing of elements other wise your not going to achieve consistent spacing and run into issues with responsiveness of your sites.

Looking again there are a lot of issues compounding the problem. For example u have a section with a fixed height and some columns also with a fixed height with negative margins on these. Its a recipe for issues.

Thanks for the help. Any suggestions on what the best way to approach this is?? Would be grateful for any direction at the moment.

This topic was automatically closed 125 days after the last reply. New replies are no longer allowed.