Bug 93411

Summary: percentage margins + flex incorrectly overflows the flexbox
Product: WebKit Reporter: Ojan Vafai <ojan>
Component: Layout and RenderingAssignee: Ojan Vafai <ojan>
Severity: Normal CC: eric, esprehn, jchaffraix, tabatkins, tony, webkit.review.bot
Priority: P2    
Version: 528+ (Nightly build)   
Hardware: Unspecified   
OS: Unspecified   
URL: http://plexode.com/u/#2W%3C2V%3E2U%222T%3B-SpxQRKJ7(1I*902Q%0AfPO8100SJwiM90rONumn)olor(salmonrNL7-direction(colrMdth(300STIQrL4Udisplay%3A7JEKHsolid6JT!EIUVrH)olG!border(2S!rGor(orange85STr9!!!!4Umargin(1Y8Jheight(b7-webkit-flexn4Wdiv!style%3Dn*W%2FdivVQr)Jbackground-c6(%3A!2!%20~http://plexode.com/eval3/#ht=PSRSKI**WbrVQQP%25R%25KI**Q
Bug Depends on:    
Bug Blocks: 62048    
Description Flags
Patch none

Description Ojan Vafai 2012-08-07 16:56:22 PDT
See the test-case in the URL field.

The problem is that RenderFlexibleBox::computeMainAxisPreferredSizes incorrectly uses the height for computing percentage margin-top/bottom in column flexboxes. As per CSS2.1 percentage margins and padding should always be computed WRT the containing block's width.

When we call layoutIfNeeded in layoutAndPlaceChildren, the margin-top/bottom gets correctly set to the right value, so the flex items size and place correctly, but we compute the wrong preferred child size in RenderFlexibleBox::computeNextFlexLine if there is actually flex on any child.
Comment 1 Ojan Vafai 2012-08-07 18:55:38 PDT
Created attachment 157083 [details]
Comment 2 Tony Chang 2012-08-07 19:08:10 PDT
Comment on attachment 157083 [details]

Stupid bug.  Thanks for fixing.
Comment 3 Tony Chang 2012-08-07 19:44:59 PDT
We probably have the same bug with padding:
Comment 4 WebKit Review Bot 2012-08-07 22:25:50 PDT
Comment on attachment 157083 [details]

Clearing flags on attachment: 157083

Committed r124987: <http://trac.webkit.org/changeset/124987>
Comment 5 WebKit Review Bot 2012-08-07 22:25:54 PDT
All reviewed patches have been landed.  Closing bug.
Comment 6 Tony Chang 2012-08-13 00:05:57 PDT
(In reply to comment #3)
> We probably have the same bug with padding:
> http://www.w3.org/TR/CSS21/box.html#padding-properties

Nevermind.  We never interact with style()->padding* directly so this isn't a problem.