w3c / csswg-drafts

CSS Working Group Editor Drafts
https://drafts.csswg.org/
Other
4.46k stars 658 forks source link

[css-break] Fragmented out-of-flow contained by box with cloned borders #10553

Open mstensho opened 3 months ago

mstensho commented 3 months ago

Spec: https://drafts.csswg.org/css-break/#break-decoration

Are out-of-flow positioned elements expected to steer clear of cloned borders in the containing block chain, or should they just overlap?

<div style="columns:3; column-fill:auto; height:100px;">
  <div style="position:relative; box-decoration-break:clone; height:160px; border:10px solid;">
    <div style="position:absolute; top:0; right:0; width:20px; height:250px; background:cyan;"></div>
  </div>
</div>

Firefox thinks so. In a way, this seems reasonable, since we're talking about out-of-flow. Then again, contained out-of-flow elements respect block fragmentation, and cloned box decorations sort of shrink the fragmentainer space available to descendants.

Cloned block edge box decorations aren't implemented by any others at the moment that I'm aware of (well, PrinceXML has it, but they don't fragment OOFs at all, it seems).

fantasai commented 4 days ago

This is a good question... absolutely positioned boxes generally don't care what happens underneath them except to the extent it changes their containing block, so I think in your example it would overlap.

But for floats, I think they would run out of room while leaving enough room for the cloned box decorations.