Comment #21 on issue 525 by verdyp: image is rendered incorrectly and moving when scrolling http://code.google.com/p/chromium/issues/detail?id=525
"Bug" in image C is easy to explain: the <div id="menu"> is positionned with as an absolute block with a high z-index, in order to make it full width, and with a height that covers the top of the scrollable area: <div id="menu" style="position:absolute; left: -8px; top:0px; width:100%; height:134px; z-index:13;"> Using such an absolutely positioned block element does not change the current position of the flow within the document body. Then the scollable area is an <iframe> (centered on the page using a legacy <center> element) containing the image of navigating boats and the text. But as it is not absolutely positioned, it just gets a lower z-index, which applies to the whole iframe, including its scrollbar. The top of it is not accessible to the mouse due to the previous overlay displayed on top of it (even if it is transparent)... Then there are several absolutely positioned elements containing several images for the menus (with really too much CSS). The design is quite ill... but anyway, all of them use a z-index >= 100 (to make sure they will be also on top of the top banner and the iframe. These elements do not change the position of flow in the body. Then comes the bottom area (which is just another HTML document within a 24-pixel frame at the bottom of the page's frameset) containing the search/home/contact/disclaimer links. As it contains nothing that's absolutely positioned and displayed with a z-index, this part just adopts the default incremented z-index. Really I cannot see anything that Chrome interprets badly there, it is behaving as per specifications. The only problem is with the effect of <center> to position the middle iframe horizontally in the page, because if you change the window size, it will not necessarily make the window's visible area even, so the centered content will jitter slightly horizontally by increments with 0 or 1 pixel horizontal increment (this pixel is not taken into account by the absolute positioning of the overlaid elements that specify a z-index) This has the effect that the top banner may not be correctly aligned with the iframe and you'll see a white 1-pixel border o appearing and disappearing on the top-left of the iframe. This page is probably a good example of bad design, that could have been written much more simply without so many styles and so many absolutely positioned elements (and even without using embedded iframes, but there's no problem here in Chrome. -- You received this message because you are listed in the owner or CC fields of this issue, or because you starred this issue. You may adjust your issue notification preferences at: http://code.google.com/hosting/settings --~--~---------~--~----~------------~-------~--~----~ Automated mail from issue updates at http://crbug.com/ Subscription options: http://groups.google.com/group/chromium-bugs -~----------~----~----~----~------~----~------~--~---
