NEW 262349
A floating element can cause another element’s "break-inside:avoid" to fail 
https://bugs.webkit.org/show_bug.cgi?id=262349
Summary A floating element can cause another element’s "break-inside:avoid" to fail
Brad Andalman
Reported 2023-09-28 17:35:20 PDT
Created attachment 467966 [details] HTML showing a paragraph that should not be split across two columns In the attached HTML, the <div> with the “callout” class is floating, but takes up 100% of the width. As a result, it pushes the following paragraph lower. Since that following paragraph has “break-inside:avoid” set, it should be moved to the next column. Instead, the paragraph is split across two columns. This is incorrect. If you turn off “float: left” on the “callout” <div>, then you can see the correct behavior: the following paragraph moves to the next column. I also tested in Google Chrome (Version 117.0.5938.132), and it behaves as expected there.
Attachments
HTML showing a paragraph that should not be split across two columns (2.89 KB, text/html)
2023-09-28 17:35 PDT, Brad Andalman 		no flags
Details
rendering in Safari, firefox, chrome (338.31 KB, image/png)
2023-09-28 18:13 PDT, Karl Dubost 		no flags
Details
HTML exhibiting the bug when float isn’t 100% (2.95 KB, text/html)
2023-09-29 11:29 PDT, Brad Andalman 		no flags
Details
Float at 50% rendering in safari, chrome, firefox (876.11 KB, image/png)
2023-09-29 11:31 PDT, Brad Andalman 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Karl Dubost
Comment 1 2023-09-28 18:13:09 PDT
Created attachment 467967 [details] rendering in Safari, firefox, chrome
Brad Andalman
Comment 2 2023-09-29 11:29:10 PDT
Created attachment 467977 [details] HTML exhibiting the bug when float isn’t 100% My initial report mentioned that this happened when the floating element took up 100% of the width. This is how I discovered the bug. However, the same problem arises even when that isn’t the case.
Brad Andalman
Comment 3 2023-09-29 11:31:03 PDT
Created attachment 467978 [details] Float at 50% rendering in safari, chrome, firefox
Radar WebKit Bug Importer
Comment 4 2023-10-05 17:36:17 PDT
<rdar://problem/116552125>
Note You need to log in before you can comment on or make changes to this bug.