[csswg-drafts] [css-sizing] `height: stretch` on a float shouldn't ignore margins (#11905)

Loirooriol has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-sizing] `height: stretch` on a float shouldn't ignore margins ==
Follow-up from #11044. https://drafts.csswg.org/css-sizing-4/#stretch-fit-sizing

> Behaves as 100%, except it sizes the [margin box](https://drafts.csswg.org/css-box-4/#margin-box) regardless of the value of [box-sizing](https://drafts.csswg.org/css-sizing-3/#propdef-box-sizing).
> 
> If this is a [block axis](https://drafts.csswg.org/css-writing-modes-4/#block-axis) size, and the element is in a Block Layout [formatting context](https://drafts.csswg.org/css-display-4/#formatting-context), and the parent element does not have a [block-start](https://drafts.csswg.org/css-writing-modes-4/#block-start) [border](https://drafts.csswg.org/css-backgrounds-3/#propdef-border) or [padding](https://drafts.csswg.org/css-box-4/#propdef-padding) and is not an [independent formatting context](https://drafts.csswg.org/css-display-4/#independent-formatting-context), treat the element’s block-start margin as zero for the purpose of calculating this size. Do the same for the [block-end](https://drafts.csswg.org/css-writing-modes-4/#block-end) margin.

```html
<!DOCTYPE html>
<div style="width: 100px; height: 100px; outline: solid magenta">
  <div style="float: left; width: stretch; height: stretch; background: cyan; margin: 25px"></div>
</div>
```

 - The float is participating in a BFC
 - The parent has no border nor padding
 - The parent doesn't establish an independent formatting context

Therefore, the spec implies the float should ignore margins and resolve `height: stretch` to `100px`.

But of course that doesn't make sense, because the margins of a float don't collapse!

Blink has implemented the reasonable thing instead of the spec, I plan to do the same in Servo.

![](https://github.com/user-attachments/assets/13050a8c-cdb0-49a0-918a-56e0e07488eb)

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/11905 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Tuesday, 11 March 2025 08:40:05 UTC