Singl theme too wide on mobile browsers

  • The Singl theme appears to render too wide on mobile (phone) browsers. I have disabled all plugins and even eliminated the background image completely, but the problem persists. Interestingly, you can even see it on the demo theme here:

    https://wordpress.com/theme/singl

    If you go to the “phone” browser demo or simply open the demo on a phone, you will see that there are scroll bars on the bottom and it slides left to right.

    Is there any way to resolve this so the theme defaults to the actual width of the phone and I no longer have an issue with scrolling left or right?

    The page I need help with: [log in to see the link]

Viewing 7 replies - 1 through 7 (of 7 total)

  • Hi @zerohere,

    I’ve visited oneminuterun.com and the Singl demo site on my phone (Android) but haven’t been able to see scrollbars at the bottom on either.

    Which device, operating system and browser are you using? Those version numbers can be found on supportdetails.com. I can then do some more testing to see whether I can replicate the issue ??

    Thread Starter zerohere

    (@zerohere)

    Hi Gemma,

    I have tried both sites on multiple phones and browsers (both Android and iPhone) and all have the same issue.

    If you click the link to the Singl demo site while on a phone you will see that swiping your finger to the left causes the entire site to scroll that direction, even though the theme appears to be optimized for the width of the mobile browser. The same is true with my website oneminuterun.com.

    Scroll bars might not show on your phone browser, but it will scroll left and right regardless.

    • This reply was modified 5 years, 5 months ago by zerohere.

    Hi @zerohere,

    Oh I see what you mean now. I was looking for a scrollbar but actually, I can just swipe left and see the extra space. I’ve reported the issue here:

    https://github.com/Automattic/themes/issues/995

    In the meantime, I tried working on some CSS to remove the extra space but haven’t had any luck — the issue doesn’t occur on Device Mode in Chrome’s developer tools so it’s quite hard to see exactly what is causing the problem. But the developers should be able to look into that ??

    Thread Starter zerohere

    (@zerohere)

    Thank you Gemma, I appreciate the help. Please let me know if you hear anything regarding a solution.

    You’re very welcome, I’ll let you know when there is more news.

    Hi again @zerohere,

    I don’t know how long it will take for the issue to be looked at so I’ve written some custom CSS which should help in the meantime:

    #page {
	overflow: hidden;
}

    This works on my test site, so hopefully it will do the trick for you too.

    Thread Starter zerohere

    (@zerohere)

    Hi Gemma,

    I tried the custom CSS you provided but unfortunately it did not resolve the issue for me.

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Singl theme too wide on mobile browsers’ is closed to new replies.