Bug 100975 – Percentage margin should be included in width calculation of block boxes

• Status: NEW
• Component: CSS

[Robert Hogan]

http://dbaron.org/css/test/intrinsic/perc-marg-min and http://dbaron.org/css/test/intrinsic/perc-marg-max cover this bug.

FF is the only one passing it currently.

[Robert Hogan]

 <div style="width: 1000px;">
   <div style="float: left;">
     <div style="margin-left: 25%"><div style="width: 300px"></div></div>
   </div>
 </div>

The width of the float in the above snippet is 400px in FF and 300px in everyone else.

Regarding percentage margins http://www.w3.org/TR/CSS2/box.html#margin-properties says: "If the containing block's width depends on this element, then the resulting layout is undefined in CSS 2.1." 

So am I right in thinking this behaviour is undefined? Should we just leave it alone?

If we should adopt FF behaviour here then what about this one:

 <div style="width: 1000px;">
   <div style="float: left;">
     <div style="margin-left: 100%"><div style="width: 300px"></div></div>
   </div>
 </div>

FF renders the float as 1000px wide. I cannot see this behaviour explained in CSS 2.1 or http://dbaron.org/css/intrinsic/ - what am I missing?

[Ojan Vafai]

Tested FF16. perc-marg-min does not size all the boxes the same size. Seems to match WebKit rendering. perc-marg-min does render differenlty though. The relevant details from dbaron's spec seem to be the following:

"If and only if the intrinsic width being adjusted is an intrinsic preferred width, divide by the larger of 0 or 1 minus the sum of any computed values of padding-left (when applicable), padding-right (when applicable), margin-left, and margin-right that are percentages. Note that this may yield an infinite result, but undefined results (zero divided by zero) must be treated as zero.

Note that the handling of percentage padding and margin is not very interoperable in today's browsers."

It's not clear to me why that behavior is preferred over the simpler thing of ignoring percentage margins. I don't think we should implement this until that spec is a proper working draft and we've discussed this specific issue on www-style, unless there is a known broken site that would be fixed by changing this.

[Ahmad Saleem]

All browsers (Safari Technology Preview 154, Chrome Canary 108 and Firefox Nightly 107) behave same in the test cases mentioned in Comment 0. Do we need to do something here? Thanks!