Issues with image not displaying properly in mobile view

So, I’m sure this some simple mistake I am making, but I could use some help.

The site looks great in the designer, but when I view it in portrait mode on mobile, the image of the doctor under “About Dr…” is not displaying properly and extending beyond the container.

Could someone look at this and give me some pointers?

Thanks!


Here is my public share link: https://preview.webflow.com/preview/deborah-westergaard-pain-specialist-m?preview=2e096da88e3398cf9924e71d87fd67ac
(how to access public share link)

Are you talking about after it’s published, or in preview? It looks fine for me at the public share link, but if it’s the published version that isn’t working correctly, that won’t help a whole lot.

Seems looks correctly to me in both, preview and published, versions.

I see what you’re talking about on my Nexus 6P. It’s on the published site.

It looks as if there is a margin being instituted in there when you publish. I think if you go onto that image within the designer and manually set the top margin to 0, that may resolve it.

Webflow seems to have a nasty habit of applying margins/padding that don’t show in designer until you grab the handle to adjust them and suddenly they snap to the hidden value.

I have spotted the culprit.

You have a set height of 400px on the “about-text” div, and a bottom margin of 247px. Set your about-text div to auto height and your bottom margin to 0, and you should be good to go.

The next problem you’ll run into is your about div has a manual height of 1,147px and a bottom padding. Set that one to auto as well with 0 bottom padding.

I THINK that takes care of all of it.

1 Like

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