You can checkout the mobile layout of commercecanvas on your iphone to see the issue. http://commercecanvas.com/

Even though none of the widths are more than 300px, it allow you to horizontal scroll, and there is a white line of about 20px down the side. Very annoying. Not sure what to check to stop it from happening.

It doesn't do it in landscape mode, so it's like somewhere a width on one of the main elements in the mobile layout is being set to a hard width of 400px or something.

Comments

peteainsworth’s picture

peteainsworth commented

I am having the same issue, though only with 1 site. I have 3 other sites all using Omega 3.1 and they all fit the screen perfectly.

I have discovered a fix which is to put an overflow:hidden; on the body tag - though this feels like a bit of a hack that doesn't really address the root cause.

peteainsworth’s picture

peteainsworth commented

The main issue with the overflow:hidden; approach is that if you have any content such as an image or a table that is larger than width of the viewport then the user will not be able to scroll across to view it all.

jazzdrive3’s picture

jazzdrive3 commented

Putting an overflow:hidden on my body element does nothing to help.

susannab’s picture

susannab commented

I put an overflow:hidden on the page tag instead of body tag, this work fine for me.
#page {
overflow: hidden;
}

susannab’s picture

susannab commented
jazzdrive3’s picture

jazzdrive3 commented
Status: Active » Closed (fixed)

susannab,

That worked for me as well. Thanks!