How do I create a full-browser-width bar without screwing up zoom on an iPhone?
I am trying to create bars of color that stretch all the开发者_C百科 way across the screen as http://css-tricks.com/9443-full-browser-width-bars/ and it is not possible to rearrange the DOM to make this easier.
The technique is awesome on desktop browsers, but on mobile WebKit overflow-x is not hidden and you can zoom way, way out or scroll over to parts of the page that only contain improbably-wide color bars. It doesn't help to set the viewport.
How do I get this effect without screwing up the zoom?
Have you tried to adding overflow-x: hidden;
to the parent element of the scroll-bars? I have found this technique useful when developing for webkit based mobile browsers.
<body>
<div id="wrap" style="overflow-x: hidden;">
<div id="massive_coloured_bar" style="your full-width technique here"></div>
</div>
</body>
精彩评论