126357 2014-01-01 00:48:48 -0800 [fragmentation] Create one border box for each fragment instead of one per fragmented element 2022-07-28 20:16:52 -0700 1 1 1 Unclassified WebKit CSS 528+ (Nightly build) Unspecified Unspecified NEW http://lists.w3.org/Archives/Public/www-style/2013Dec/0466.html InRadar P2 Normal --- 126336 1 krit webkit-unassigned abucur ahmad.saleem792 ap bfulgham hyatt mibalan mihnea rniwa sam simon.fraser webkit-bug-importer WebkitBugTracker zalan oldest_to_newest 963591 0 krit 2014-01-01 00:48:48 -0800 Firefox and Internet Explorer create a new border box for each fragment of an element. This has rather big consequences on layout and CSSOM View. CSS Transforms does use border box for calculating the transform origin. For a multi-column layout each fragment is transformed individually "after" layout was done (each fragment has its own user space). Therefore, the origin changes for each fragment. Clipping paths can be sized per fragment width instead of calculating a global dimension for a clipping path. On the other hand, it is unclear how the width of a background tile is determined (another discussion on www-style). 963592 1 220183 krit 2014-01-01 00:50:22 -0800 Created attachment 220183 Example 963623 2 simon.fraser 2014-01-01 12:52:28 -0800 It's not clear from the title of this bug what actual issue you are reporting. 963683 3 krit 2014-01-01 22:33:42 -0800 (In reply to comment #2) > It's not clear from the title of this bug what actual issue you are reporting. I hope that makes it a bit more understandable. I recommend to read the post from roc on wwww-style. See link above. 963684 4 sam 2014-01-01 22:38:51 -0800 (In reply to comment #3) > (In reply to comment #2) > > It's not clear from the title of this bug what actual issue you are reporting. > > I hope that makes it a bit more understandable. I recommend to read the post from roc on wwww-style. See link above. One thing that might make it a bit easier to understand would be if the example test case had actual and expected values presented (or green and red boxes if you are into that kind of thing). 963690 5 krit 2014-01-01 22:52:04 -0800 (In reply to comment #4) > (In reply to comment #3) > > (In reply to comment #2) > > > It's not clear from the title of this bug what actual issue you are reporting. > > > > I hope that makes it a bit more understandable. I recommend to read the post from roc on wwww-style. See link above. > > One thing that might make it a bit easier to understand would be if the example test case had actual and expected values presented (or green and red boxes if you are into that kind of thing). The test case adds a line for each client rect created per element. In WebKit, there is just one client rect created. In Firefox you get two. I will upload a second test case which demonstrates the difference of multiple border boxes on transform. 963695 6 220206 krit 2014-01-01 23:33:10 -0800 Created attachment 220206 2nd example with explanations 1887463 7 ahmad.saleem792 2022-07-28 15:01:02 -0700 I am still able to reproduce this bug in Safari 15.6 on macOS 12.5 using attached test case, Safari renders the box different from other browsers (Chrome Canary 106 and Firefox Nightly 104). Thanks! 1887525 8 webkit-bug-importer 2022-07-28 20:16:52 -0700 <rdar://problem/97760056> 220183 2014-01-01 00:50:22 -0800 2014-01-01 00:50:22 -0800 Example multi-break-2.html text/html 700 krit PGRpdiBpZD0iY29sdW1uIj4KICAgIDxkaXYgaWQ9ImZsb3ciPjwvZGl2Pgo8L2Rpdj4KPHAgaWQ9 InRleHQiPjwvcD4KPHN0eWxlPgojY29sdW1uIHsKICAgIC1tb3otY29sdW1uLWNvdW50OiAyOwog ICAgLXdlYmtpdC1jb2x1bW4tY291bnQ6IDI7CiAgICBjb2x1bW4tY291bnQ6ICAyOwogICAgd2lk dGg6IDMwMHB4Owp9CiNmbG93IHsKICAgIHdpZHRoOiAxMDBweDsKICAgIGJvcmRlcjogMTBweCBs aWdodGdyZWVuIHNvbGlkOwogICAgYmFja2dyb3VuZC1jb2xvcjogY3lhbjsKICAgIGhlaWdodDog NDAwcHg7CiAgICAtd2Via2l0LXRyYW5zZm9ybTogcm90YXRlKDE1ZGVnKTsKICAgIHRyYW5zZm9y bTogcm90YXRlKDE1ZGVnKTsKfQo8L3N0eWxlPgo8c2NyaXB0Pgp2YXIgcmVjdCA9IGRvY3VtZW50 LmdldEVsZW1lbnRCeUlkKCdmbG93JykuZ2V0Q2xpZW50UmVjdHMoKTsKdmFyIHRleHQgPSAnJzsK Zm9yICh2YXIgaSA9IDA7IGkgPCByZWN0Lmxlbmd0aDsgaSsrKSB7Cgl0ZXh0ICs9ICdSZWN0ICcg KyBpICsgJyBsZWZ0OiAnICsgcmVjdFtpXS5sZWZ0ICsgJyB0b3A6ICcgKyByZWN0W2ldLnRvcCAr ICcgd2lkdGg6ICcgKyByZWN0W2ldLndpZHRoICsgJyBoZWlnaHQ6ICcgKyByZWN0W2ldLmhlaWdo dCArICc8YnI+JzsKfQpkb2N1bWVudC5nZXRFbGVtZW50QnlJZCgndGV4dCcpLmlubmVySFRNTCA9 IHRleHQ7Cjwvc2NyaXB0Pg== 220206 2014-01-01 23:33:10 -0800 2014-01-01 23:33:10 -0800 2nd example with explanations multi-break-3.html text/html 2732 krit PGgyPkN1cnJlbnQgYnJvd3NlciBiZWhhdmlvcjwvaDI+CjxwPjIgY29sdW1uIGxheW91dC4gT25l IGJveCBpcyByb3RhdGVkIGFuZCBmcmFnbWVudGVkIGFjcm9zcyAyIGNvbHVtbnMuCjxkaXYgY2xh c3M9ImNvbHVtbiI+CiAgICA8ZGl2IGNsYXNzPSJmbG93Ij48L2Rpdj4KPC9kaXY+CjxoMj5DdXJy ZW50IGJyb3dzZXIgYmVoYXZpb3I8L2gyPgo8cD5CZWhhdmlvciBvbiBHZWNrbzwvcD4KPGRpdiBz dHlsZT0iYm9yZGVyLWJvdHRvbTogMDsgZmxvYXQ6IGxlZnQ7IiBjbGFzcz0iZ2Vja28iPjwvZGl2 Pgo8ZGl2IHN0eWxlPSJtYXJnaW4tbGVmdDogNTBweDsgYm9yZGVyLXRvcDogMDsgZmxvYXQ6IGxl ZnQ7IiBjbGFzcz0iZ2Vja28iPjwvZGl2Pgo8cCBzdHlsZT0iY2xlYXI6IGJvdGgiPlRoZSBlbGVt ZW50IGJlaGF2ZXMgYXMgaWYgaXQgd291bGQgY29uc2lzdCBvZiB0d28gYm94ZXMgbm93IC0gdHJh bnNmb3JtZWQgaW5kaXZpZHVhbGx5LiBUaGUgdHJhbnNmb3JtIG9yaWdpbiBpcyBpbiB0aGUgY2Vu dGVyIG9mIGVhY2ggYm94LiBUaGF0IGlzIGV4YWN0bHkgd2hhdCBJRSBhbmQgRmlyZWZveCBkby4g Z2V0Q2xpZW50UmVjdHMoKSB3b3VsZCByZXR1cm4gdHdvIGJveGVzLjwvcD4KPGgyPkdsdWUgdGhl IGJveGVzIHRvZ2V0aGVyPC9oMj4KPHA+SWYgd2Ugd291bGQgZ2x1ZSB0aGVzZSAyIGJveGVzIHRv Z2V0aGVyIHVuZGVybmVhdGggZWFjaCBvdGhlci4gSXQgbG9va3MgbGlrZSB0aGlzOjwvcD4KPHA+ V2ViS2l0PC9wPgo8ZGl2IHN0eWxlPSItd2Via2l0LWNsaXAtcGF0aDogcmVjdGFuZ2xlKDUycHgs IDEwcHgsIDE1MHB4LCA0NDBweCk7Ij4KPGRpdiBjbGFzcz0iZmxvdyI+PC9kaXY+CjwvZGl2Pgo8 cD5HZWNrbzwvcD4KPGRpdiBzdHlsZT0iYm9yZGVyLWJvdHRvbTogMDsgIiBjbGFzcz0iZ2Vja28i PjwvZGl2Pgo8ZGl2IHN0eWxlPSJtYXJnaW4tbGVmdDogNTBweDsgYm9yZGVyLXRvcDogMDsiIGNs YXNzPSJnZWNrbyI+PC9kaXY+CjxoMj5TYW1lIGV4YW1wbGUgd2l0aCB0ZXh0PC9oMj4KPHA+V2Vi S2l0PC9wPgo8ZGl2IGNsYXNzPSJjb2x1bW4iPgogICAgPGRpdiBjbGFzcz0iZmxvdyI+TG9yZW0g aXBzdW0gZG9sb3Igc2l0IGFtZXQsIGNvbnNlY3RldHVlciBhZGlwaXNjaW5nIGVsaXQsIHNlZCBk aWFtIG5vbnVtbXkgbmliaCBldWlzbW9kIHRpbmNpZHVudCB1dCBsYW9yZWV0IGRvbG9yZSBtYWdu YSBhbGlxdWFtIGVyYXQgdm9sdXRwYXQuIFV0IHdpc2kgZW5pbSBhZCBtaW5pbSB2ZW5pYW0sIHF1 aXMgbm9zdHJ1ZCBleGVyY2kgdGF0aW9uIHVsbGFtY29ycGVyIHN1c2NpcGl0IGxvYm9ydGlzIG5p c2wgdXQgYWxpcXVpcCBleCBlYSBjb21tb2RvIGNvbnNlcXVhdC48L2Rpdj4KPC9kaXY+CjxwPkdl Y2tvPC9wPgo8ZGl2IHN0eWxlPSJib3JkZXItYm90dG9tOiAwOyBmbG9hdDogbGVmdDsiIGNsYXNz PSJnZWNrbyI+TG9yZW0gaXBzdW0gZG9sb3Igc2l0IGFtZXQsIGNvbnNlY3RldHVlciBhZGlwaXNj aW5nIGVsaXQsIHNlZCBkaWFtIG5vbnVtbXkgbmliaCBldWlzbW9kIHRpbmNpZHVudCB1dCBsYW9y ZWV0IGRvbG9yZSBtYWduYSBhbGlxdWFtIGVyYXQgdm9sdXRwYXQuPC9kaXY+CjxkaXYgc3R5bGU9 Im1hcmdpbi1sZWZ0OiA1MHB4OyBib3JkZXItdG9wOiAwOyBmbG9hdDogbGVmdDsiIGNsYXNzPSJn ZWNrbyI+VXQgd2lzaSBlbmltIGFkIG1pbmltIHZlbmlhbSwgcXVpcyBub3N0cnVkIGV4ZXJjaSB0 YXRpb24gdWxsYW1jb3JwZXIgc3VzY2lwaXQgbG9ib3J0aXMgbmlzbCB1dCBhbGlxdWlwIGV4IGVh IGNvbW1vZG8gY29uc2VxdWF0LjwvZGl2Pgo8L2Rpdj48L2Rpdj4KPHAgc3R5bGU9ImNsZWFyOiBi b3RoIj5Ob3RlOiBUaGUgdGV4dCBpbiBXZWJLaXQgZ2V0cyBjbGlwcGVkIGluIHRoZSBtaWRkbGUu IFRoaXMgaXMgbm90IGRlc2lyYWJsZSBidXQgYSBkaWZmZXJlbnQgcGFydCBvZiB0aGUgc2FtZSBw cm9ibGVtIHRyYWNrZWQgaW4gPGEgaHJlZj0iaHR0cHM6Ly9idWdzLndlYmtpdC5vcmcvc2hvd19i dWcuY2dpP2lkPTEyNjMzNiI+YnVnIDEyNjMzNjwvYT4uPC9wPgo8cD5JZiB5b3UgaGF2ZSBtdWx0 aXBsZSBjb2x1bW5zIGFuZCB0aGUgdGV4dCBzcHJlYWRzIGFjcm9zcyAzIGNvbHVtbnMsIGl0IHdv dWxkIG5vdCBiZSByZWFkYWJsZSBpbiB0aGlyZCBjb2x1bW4gZm9yIFdlYktpdCBhbnltb3JlLjwv cD4KPHA+VGhlIHByb2JsZW0gYWZmZWN0cyBvdGhlciB2aXN1YWwgZWZmZWN0cyBsaWtlIGNsaXBw aW5nIGFuZCBtYXNraW5nIGFzIHdlbGwuPC9wPgo8c3R5bGU+Ci5jb2x1bW4gewogICAgLW1vei1j b2x1bW4tY291bnQ6IDI7CiAgICAtd2Via2l0LWNvbHVtbi1jb3VudDogMjsKICAgIGNvbHVtbi1j b3VudDogIDI7CiAgICB3aWR0aDogMzAwcHg7Cn0KLmZsb3cgewogICAgd2lkdGg6IDEwMHB4Owog ICAgYm9yZGVyOiAxMHB4IGxpZ2h0Z3JlZW4gc29saWQ7CiAgICBiYWNrZ3JvdW5kLWNvbG9yOiBj eWFuOwogICAgaGVpZ2h0OiA0MDBweDsKICAgIC13ZWJraXQtdHJhbnNmb3JtOiByb3RhdGUoMTVk ZWcpOwogICAgdHJhbnNmb3JtOiByb3RhdGUoMTVkZWcpOwp9Ci5nZWNrbyB7CiAgICBib3JkZXI6 IDEwcHggbGlnaHRncmVlbiBzb2xpZDsKICAgIGJhY2tncm91bmQtY29sb3I6IGN5YW47CiAgICAt d2Via2l0LXRyYW5zZm9ybTogcm90YXRlKDE1ZGVnKTsKICAgIHRyYW5zZm9ybTogcm90YXRlKDE1 ZGVnKTsKICAgIHdpZHRoOiAxMDBweDsKICAgIGhlaWdodDogMjAwcHg7Cn0KPC9zdHlsZT4=