22764 2008-12-09 14:26:08 -0800 bottom border misaligned due to image 2011-05-18 03:12:16 -0700 1 1 1 Unclassified WebKit New Bugs 525.x (Safari 3.2) PC Windows XP RESOLVED INVALID http://www.googlelunarxprize.org/ HasReduction P2 Normal --- 0 jasneet webkit-unassigned eric hyatt jasneet mustaf.here oldest_to_newest 102014 0 jasneet 2008-12-09 14:26:08 -0800 I Steps: Go to http://www.googlelunarxprize.org/ II Issue: In right and left columns, the bottom border below rss feed subscribe is misaligned. III Conclusion: If we remove feed image before text "Subscribe", then it works fine in webkit IV Other Browsers: IE7: ok FF3: ok V Nightly tested: 39088 Bug in Chromium : http://code.google.com/p/chromium/issues/detail?id=1438 102015 1 25898 jasneet 2008-12-09 14:37:04 -0800 Created attachment 25898 reduced testcase 403397 2 eric 2011-05-12 23:05:06 -0700 Our display of the test case matches Firefox. Are we sure this a bug? 403573 3 hyatt 2011-05-13 08:54:46 -0700 This doesn't look like a valid bug to me. 405564 4 eric 2011-05-18 00:53:03 -0700 Our current behavior matches FF4, so clearly they've changed their behavior away from FF3. Line height measurement is documented here: http://www.w3.org/TR/CSS2/visudet.html#line-height Hmmm... This section also seems relevant: The border box of a table, a block-level replaced element, or an element in the normal flow that establishes a new block formatting context (such as an element with 'overflow' other than 'visible') must not overlap the margin box of any floats in the same block formatting context as the element itself. If necessary, implementations should clear the said element by placing it below any preceding floats, but may place it adjacent to such floats if there is sufficient space. They may even make the border box of said element narrower than defined by section 10.3.3. CSS2 does not define when a UA may put said element next to the float or by how much said element may become narrower. http://www.w3.org/TR/CSS2/visuren.html#floats 405566 5 eric 2011-05-18 00:58:19 -0700 It looks like the float overflows the <div> (which seems to be expected, but I haven't found the relevante CSS 2.1 text yet), but the <table> has an implicit clear on it. Meaning the table is pushed down below the float, causing the gap in the border. In general comparing with IE (especially in strict mode) is folly. IE's rendering has historically been horribly non-standards compliant. They were the standard for years and years, but that is no longer the case. 405568 6 eric 2011-05-18 01:03:37 -0700 "Since a float is not in the flow, non-positioned block boxes created before and after the float box flow vertically as if the float did not exist. However, the current and subsequent line boxes created next to the float are shortened as necessary to make room for the margin box of the float." Maybe be the relevant line of CSS 2.1 to explain that floats can overflow out of their containing blocks. I think basically floats don't create line boxes, so they don't get included in block height calculations, thus blocks colapse to fit their lines, while floats may yet overflow those blocks. This test case is invalid as far as I can tell. IE's behavior is wrong. 405569 7 eric 2011-05-18 01:05:54 -0700 This IE quirk is in fact explicitly mentioned in "on having layout" (a great read if you ever want to write a site which works in IE!): http://www.satzansatz.de/cssd/onhavinglayout.html#clear "Floats are auto-contained by layout elements. That's one reason why most beginners struggle with their IE-build pages in a compliant browser where floats stick out of the container when not cleared." Basically IE auto-clears floats and CSS 2.1 says not to. 405611 8 mustaf.here 2011-05-18 03:12:16 -0700 (In reply to comment #6) > "Since a float is not in the flow, non-positioned block boxes created before and after the float box flow vertically as if the float did not exist. However, the current and subsequent line boxes created next to the float are shortened as necessary to make room for the margin box of the float." > > Maybe be the relevant line of CSS 2.1 to explain that floats can overflow out of their containing blocks. > > I think basically floats don't create line boxes, so they don't get included in block height calculations, thus blocks colapse to fit their lines, while floats may yet overflow those blocks. > > This test case is invalid as far as I can tell. IE's behavior is wrong. Hi Eric, I might be wrong, but based on my investigation, I have found that floats create their own line boxes (in RenderBlock::LineBreaker::skipLeadingWhitespace, therefore they call positionNewFloatOnLine from here). But inside positionNewFloatOnLine(), I did not find any code to update block height. This could be the right behavior, but this is what I saw in the code 25898 2008-12-09 14:37:04 -0800 2008-12-09 14:37:04 -0800 reduced testcase reduced testcase.zip application/zip 2440 jasneet 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 PIgb6ZB3e+hSM9CRUbQIF97J0lzArrM4CEGVgaRX/gnpLtpYhXZtDVEurZV1gjyPLt/+nXc+MpxB TnWkebW0KO7Gh3Z7NaOVFs+fOABeVyRYiG/mnWN8l8vNXV7FFS9fpGvO7DJBJyf/S9/T9SgJGu5X YKVK0NmTS+qa0YGgvu/h8DedGQlreeG1ft/9knjJ+APiLMOP0P2WIvcEayGoMRlua3CmW1kD8uuF lqDBOwZXdTFzXUJGFxkuAVismgojKtw38+n2FrekMjycYNSONcMD7CB8vvY6bGuGXW98llVuCs1z mBHVsyGOTq+HVepBXaX7qMGn9dJB70+sLyYsK95j/HishdQNaBN/V5VzIpb9QSQBslUDB3cKxILs u0rC7+U3UEsBAhQACgAAAAAAZHOJOQAAAAAAAAAAAAAAABEAAAAAAAAAAAAQAAAAAAAAAHJlZHVj ZWQgdGVzdGNhc2UvUEsBAhQACgAAAAAAHXl1OQx5YUKxAgAAsQIAABkAAAAAAAAAAAAgAAAALwAA AHJlZHVjZWQgdGVzdGNhc2UvZmVlZC5wbmdQSwECFAAUAAAACAAdeXU5I+fcxTgCAABPAwAAKgAA AAAAAAAAACAAAAAXAwAAcmVkdWNlZCB0ZXN0Y2FzZS9sZWZ0X2NvbF9ib3hfYmNvcm5lcnMuanBn UEsBAhQAFAAAAAgASod1Oc0QG+VrAgAApgQAACMAAAAAAAAAAAAgAAAAlwUAAHJlZHVjZWQgdGVz dGNhc2UvdGVzdC1zdGFuZGFyZC5odG1sUEsFBgAAAAAEAAQALwEAAEMIAAAAAA==