Device Resize Causes White Border

magicprophecy's picture
magicprophecy
Sat, 07/26/2014 - 03:33
#1
Device Resize Causes White Border

On demo from tablet when I switch from landscape to portrait and resize the page a white border shows up along the entire length of the right side from then on even if I go back to landscape mode or parallax to a section. A few refreshes need to be done to get rid of it!

Thanks!

magicprophecy's picture
magicprophecy
Sun, 07/27/2014 - 21:40

We've been unable to figure this one out!

Thanks!

magicprophecy's picture
magicprophecy
Sun, 07/27/2014 - 23:44

Ok so I figured out that the problem is not just body but also html needs a overflow-x:hidden;

When I add this that white border on the right is gone!

However the fixed menu is no longer fixed as well no longer functions among other things!

Thanks for helping with this one! We are trying to launch this site and this is really our last remaining big bug!

magicprophecy's picture
magicprophecy
Sun, 07/27/2014 - 23:53

Ok fixed this by adding:

.container {overflow-x:hidden}

to stylesheet!

cindy's picture
cindy
Mon, 07/28/2014 - 03:11

Hi,
Thank you for your contributive feedback

Regards,

magicprophecy's picture
magicprophecy
Mon, 07/28/2014 - 21:21

When I add .container {overflow-x:hidden} it causes a few extra problems like disabling the contact form among other things!

Any other ideas on the white bar on the right after resizing the site on a device?

The demo also demonstrates the error!

Thanks!

cindy's picture
cindy
Thu, 07/31/2014 - 06:59

Hi,
white border is the default setting when you set overflow: auto
Setting overflow: hidden will make the content in its container disappear. Thus, it's better to keep that setting

magicprophecy's picture
magicprophecy
Sat, 08/09/2014 - 14:42

When I made that change the Scroll to Top stopped working in Firefox!

Log in or register to post comments
Have More Idea?

We are here to build your website!

No Universal solution fits all special business requirements. Our experienced team is ready with ideas and state-of-the-art technical solutions to consult the best solution within your budget.