Mobile view is correct on Iphone but not on Android

When the mobile view breaks like this, it’s almost always because something on the page is forcing a fixed width that’s wider than the screen.

Anyway… looks like the issue was resolved :slight_smile:

1 Like

Yes, it is resolved, and it doesn’t seem to be a problem in Elements but rather Firefox settings on mobile.

I opened it on Chrome and it looks fine.

Your Firefox issue looking at my mobile appears to be the hero but I am at work so can’t check

jus a quick tip, turn on show editor settings eg shown outlines

check for float, on any screen width use two touch to slide view left right, see float then, show outlines will help pinpoint issues + as you scroll down you can see where the area overhangs

see three issues in one here - not sure if you meant one of the texts to be set with making right auto

1 Like

Thank you so much, Steve, for all your help. I solved the issue.

Actually, it was like someone suggested that the header in some containers was too big. You also identified the HTML that was causing the problem and showed me that the float was already visible in Elements, indicating it was not an issue on the phone or browser.

I purchased the collection of essentials and thought that I could use the elements as is, and once implemented, they would automatically adjust. Changing the containers to a breakpoint didn’t solve it in that case.

Some of my words in the headers were very long, and a long word just made the container wider, creating the float for all the others that were a “normal” size.

Once I made the headers smaller, the issue was solved. There are no floating elements on any phone or any browser.

I hope this helps anyone who might encounter a similar issue.

1 Like

That’s what solved it for me. Thanks