Webflow causing x-overflow on mobile

I have created a new project for my marketing website. The issue that I’m having is that when it goes to mobile, it creates a horizontal scroll bar.

There is no content in it, so my site still fits nicely on a phones screen, but a user can scroll right and see the blank space. It seems to only happen in chrome. Its fine in all other browsers

I could just add

html {
    overflow-x: hidden;

But i’m worried google wont consider my site, mobile friendly. How can I fix this?



screen shot

Chrome 43

Hi @steelesong

Can you please update your post with some more information so we can help you faster? Things like screenshots and your environment info really speed things up.

Posting guidelines can be found here: Posting Guidelines for the Design Help Category

Thanks in advance! :slight_smile:

You can try make body’s overflow=hidden.

Just a note, it is not the best practice keep elements 100% width on mobile view. I am usually trying to follow this rules

I do not say it is necessary, but at least for mobiles and tablets it feels more comfortable for user

1 Like

I dont just want to hid ethe overflow. I dont want it to be there in the first place. Google won’t consider my website mobile friendly if there is overflow. Even if its hidden.

Hi @steelesong, it is not necessary to use overflow hidden, if you keep all of your elements within their parent containers and within the body.

You can do this by using percentage based widths instead of pixel based widths. I took a quick peek at your site in all views, but I cannot see any overflow. Are you still having an issue with this?

If you are still having an issue for this, could you also share the published site link, so that I can test on some different mobile devices? And, what mobile device is it, that is having the issue?


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