Bug 122754

Summary: [New Multicolumn] Child top margin sometimes ignored for column balancing
Product: WebKit Reporter: Morten Stenshorne <mstensho>
Component: Layout and RenderingAssignee: Morten Stenshorne <mstensho>
Status: RESOLVED FIXED    
Severity: Normal CC: andymercer, commit-queue, esprehn+autocc, glenn, hyatt, kondapallykalyan, WebkitBugTracker
Priority: P2    
Version: 528+ (Nightly build)   
Hardware: Unspecified   
OS: Unspecified   
Attachments:
Description Flags
Test case
none
Patch none

Morten Stenshorne
Reported 2013-10-14 08:10:45 PDT
During the first layout pass, the code incorrectly believes that the element ends up in the next column (or page), and eats the margin. Apart from broken layout, this may even cause an assertion failure: ASSERTION FAILED: currentMinSpaceShortage != LayoutUnit::max() ../../Source/WebCore/rendering/RenderMultiColumnSet.cpp(112) : bool WebCore::RenderMultiColumnSet::calculateBalancedHeight(bool) ... because the column heights don't become tall enough in the initial balancing pass.
Attachments
Test case (550 bytes, text/html)
2013-10-14 08:11 PDT, Morten Stenshorne 		no flags
Details
Patch (14.23 KB, patch)
2014-03-28 09:16 PDT, Morten Stenshorne 		no flags
DetailsFormatted DiffDiff
View All Add attachment proposed patch, testcase, etc.
Morten Stenshorne
Comment 1 2013-10-14 08:11:58 PDT
Created attachment 214152 [details] Test case
Morten Stenshorne
Comment 2 2014-03-28 08:46:41 PDT
Corresponding bug in Blink: http://code.google.com/p/chromium/issues/detail?id=353587
Morten Stenshorne
Comment 3 2014-03-28 09:16:54 PDT
Created attachment 228054 [details] Patch
Morten Stenshorne
Comment 4 2014-03-28 09:18:22 PDT
@dave - can you review this, please? I couldn't really avoid fixing this one while working on spanners support.
Dave Hyatt
Comment 5 2014-04-04 11:19:44 PDT
Comment on attachment 228054 [details] Patch r=me
WebKit Commit Bot
Comment 6 2014-04-08 11:20:14 PDT
Comment on attachment 228054 [details] Patch Clearing flags on attachment: 228054 Committed r166938: <http://trac.webkit.org/changeset/166938>
WebKit Commit Bot
Comment 7 2014-04-08 11:20:17 PDT
All reviewed patches have been landed. Closing bug.
Andy Mercer
Comment 8 2014-05-19 12:42:47 PDT
This was landed back in April, but it appears to still be broken. See: http://stackoverflow.com/questions/23745077/block-elements-inside-multicolumn-layout-padding-issue-in-chrome-ie http://jsfiddle.net/6cVqZ/
Morten Stenshorne
Comment 9 2014-08-27 12:47:58 PDT
That's unrelated to this bug, but it seems that someone answered your stackoverflow question while I was gone. The clue is to use break-inside:avoid . This property doesn't yet exist in Blink, though (and I assume the same is still the case for WebKit as well). You have to say li { -webkit-column-break-inside:avoid; } instead.
Note You need to log in before you can comment on or make changes to this bug.