On Jun 10, 2011, at 8:29 AM, weblist99 wrote: > Alright. Good reminder! However from what is presented in the iPad Safari, > I am still not convinced this is the overflow issue for two reasons: > > 1) The 1500px background is outside the #container which has 1014px width > and previously with overflow:hidden. It belongs to #container-wrap which > has a 100% width. > > 2) In my previous test (http://jsbin.com/aholi4/) which contained > the overflow:hidden, in which the upper top green bar is a repeated > background image with 100% width declared, and belongs to #sitewrap, which > you commented unnecessary, so in the newest test I removed the 100%. > > Both the #container-wrap and #sitewrap are the the outer divs > for #container, so they should not be cut off in my understand of how CSS > works.
1. The fact that you specified 'overflow: hidden' on one container doesn't relate to your original issue at all. It would just make it harder (not impossible) for the iPad user to scroll to the right part of that container if it where clipped by the right edge of the device. 2. Did you try, as I suggested in my original reply, to open your page in a ~600px wide window on desktop Safari / Firefox / Chrome / IE 8+ ? And scroll to the right ? You'll see exactly the same issue as what you see on your iPad… [1]. And that is exactly how CSS is designed to work. You outer boxes (static, inflow boxes) are as wide as the viewport, and don't expand because one inner container is set to be wider. Instead, the wider box will overflow (on a desktop browser, you'll see a horizontal scrollbar). The viewport is similarly just a static, inflow block box that won't expand because the content is wider. [1] here is an absolutely minimal reduction of your page: http://dev.l-c-n.com/_temp/tee2.html Open in any recent desktop browser, and scroll to the right, look at the background-colors. ) I assume your desktop monitor is less than 4000px wide (or that your browser window is not full screen) … Another test case: you don't expect the lime green box to expand, do you ? http://dev.l-c-n.com/_temp/tee3.html Philippe -- Philippe Wittenbergh http://l-c-n.com/ ______________________________________________________________________ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
