Status: Unconfirmed Owner: ---- Labels: Type-Bug Pri-2 OS-All Area-Misc New issue 25787 by Hanrui.Gao: Inconsistency between calculation and display when a div with overflow other than visible follows a float element. http://code.google.com/p/chromium/issues/detail?id=25787
Chrome Version : 4.0.223.11 URLs (if applicable) : http://tech.sina.com.cn/roll/2009-06- 10/11093166185.shtml Other browsers tested: Add OK or FAIL after other browsers where you have tested this issue: Safari 4: Fail Firefox 3.x: OK IE 6: OK IE 7: OK IE 8: OK What steps will reproduce the problem? 1. Launch the URL above 2. Pay attention to "7月起新售电脑预装过滤软件" area (or you can search this string in page) 3. Chrome and Safari have a large blank area and miss the introduction of "绿坝-花季护航上网过滤软件" which should appear just on the right of the picture. What is the expected result? The introduction words of "绿坝-花季护航上网过滤软件" should appear on the right hand of the picture in "7月起新售电脑预装过滤软件" area. What happens instead? Chrome and Safari have a large blank area and miss the introduction of "绿 坝-花季护航上网过滤软件" which should appear just on the right of the picture. (Attached please find the screenshot.) Please provide any additional information below. Attach a screenshot if possible. This looks like a bug of webkit engine, so Safari and Chrome 3/4 all have this issue. This bug only happens when there's a float element and a div which has overflow set other than 'visible' and have a left-margin. I guess this is caused by inconsistency between calculation and display. From my testcases you can find that when calculating the width of the inner unfloat div, Chrome and Safari use the (width of the outer div) - (width of inner the float div) as the containing block width. So in Chrome and Safari, the inner unfloat div width is: 600px(width of outer div)-200px(width of inner float div)-300px(left margin of itself)=100px The reason of Safari and Chrome deduct the float width from the containing block width is like they both refer the rule here: http://www.w3.org/TR/CSS2/visuren.html#floats (the 5th paragraph of 9.5). But when laying out, Chrome and Safari overlap the left-margin area and the float element. So there will be a unexpected blank area on the right of the outer div. Attachments: dgkmrsw5_169cx23jmf9_b.png 184 KB testcase_of_margin_left_affected_computed_width_quirk.html 2.5 KB testcase_of_margin_left_affected_computed_width_standard.html 2.5 KB -- 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 -~----------~----~----~----~------~----~------~--~---
