Bug 223687 – box-decoration-break: clone is not taken into account when breaking lines

• Status: RESOLVED
• Resolution: CONFIGURATION CHANGED
• Component: CSS

[Johannes Odland]

Created attachment 424124 [details]
Screenshot shows inline-elements overflowing container due to box-decoration-break: clone

Steps to reproduce the problem:
1. Add a span inside a div.
2. Define a width on the div.
3. Set `box-decoration-break: clone`, `padding: 15px` and `word-break: break-all` on the span.
4. Fill the span with text.

https://codepen.io/johannesodland/pen/BaQgEyZ

What is the expected behavior?
The padding added on each line through `box-decoration-break: clone` should be accounted for when breaking lines. Each padding-box should stay within the container. 

What went wrong?
The extra padding is not accounted for when breaking lines and the extra padding overflows the container.

Did this work before? N/A 

Does this work in other browsers? Yes

[Johannes Odland]

Created attachment 424125 [details]
Testcase reproducing the bug

[Radar WebKit Bug Importer]

<rdar://problem/76048576>

[Johannes Odland]

Created attachment 466058 [details]
A screenshot of Safari 16.1 and 16.4. The issue is present in 16.1, but fixed in 16.4

I have moved the test case for easier testing, and retested in Safari 16.4.

The issue seems to be resolved in Safari 16.4.

Url to test case: https://johannesodland.github.io/browserbugs/safari-box-decoration-break-clone-padding-ignored-issue.html

[zalan]

(In reply to Johannes Odland from comment #3)
> Created attachment 466058 [details]
> A screenshot of Safari 16.1 and 16.4. The issue is present in 16.1, but
> fixed in 16.4
> 
> I have moved the test case for easier testing, and retested in Safari 16.4.
> 
> The issue seems to be resolved in Safari 16.4.
> 
> Url to test case:
> https://johannesodland.github.io/browserbugs/safari-box-decoration-break-
> clone-padding-ignored-issue.html
Thank you for following up on this! This has progressed at 255771@main (this is when we switched over to the new modern line layout for 'clone'. (IFC progression)).