65917 2011-08-09 06:44:24 -0700 Applying writing-mode:vertical-rl to td does not make the table cell vertical 2025-11-30 21:53:52 -0800 1 1 1 Unclassified WebKit Layout and Rendering 528+ (Nightly build) All All NEW InRadar P2 Normal --- 46123 168162 1 kojii webkit-unassigned ahmad.saleem792 ayagawap browserbugs2 cbiesinger eoconnor fantasai.bugs itshustletime mmaxfield phiw2 rasamassen tlock.chijin webkit-bug-importer zalan oldest_to_newest 448559 0 103355 kojii 2011-08-09 06:44:24 -0700 Created attachment 103355 Table cell with writing-mode:vertical-rl applied Applying writing-mode:vertical-rl to td does not seem to be working. I have attached a sample HTML file that reproduce the issue with the Nightly build. I then tried to put <p> inside td and applied writing-mode:vertical-rl, which made the text vertical but its position isn't correct. Both rows renders as I expect in IE9. I tried this on Safari and Nightly build on Lion, and also on Safari and Chrome on Windows. All resulted the same. This is my first try to put a bug in webkit, so please excuse me if I made something incorrect, and I apologize in advance for any troubles I may have caused. I tried to look for dup bugs, 46997 may be related but I couldn't figure out if this is dup of the bug or not. 527914 1 rasamassen 2011-12-29 06:50:04 -0800 <td> with writing-mode:vertical-rl fails in Windows on Chrome 16 as well. <td> with writing-mode (old IE lingo) works in IE9, but renders the <td> with the wrong height (if the <tr> is taller than the writing-mode cell needs, it shortens the cell - easily revealed by putting a border on cells and making a tall <td>); please make sure the <td> maintains the same row height as other cells when writing mode is changed. 531709 2 121566 rasamassen 2012-01-07 20:47:10 -0800 Created attachment 121566 writing-mode:vertical-rl test on td and th tags. 531710 3 rasamassen 2012-01-07 20:58:00 -0800 writing-mode should work on <th> and <td> elements, per http://www.w3.org/TR/css3-writing-modes/#writing-mode and http://dev.w3.org/csswg/css3-writing-modes/#writing-mode (working draft and editors draft), which excludes table row groups, table column groups, table rows, and table columns, but not table header cells or table data cells. 789816 4 rasamassen 2012-12-12 12:53:24 -0800 Blocks 46123 863827 5 cbiesinger 2013-03-26 10:45:37 -0700 *** Bug 113325 has been marked as a duplicate of this bug. *** 863992 6 cbiesinger 2013-03-26 14:14:12 -0700 Note, IE supports this. http://jsbin.com/ayeyag/4 1191332 7 browserbugs2 2016-05-09 15:20:30 -0700 2 additional reduced and self-explanatory tests: http://www.gtalbot.org/BrowserBugsSection/CSS3WritingModes/orthogonal-vrl-table-cells-001.html http://www.gtalbot.org/BrowserBugsSection/CSS3WritingModes/orthogonal-vrl-table-cells-002.html 1365780 8 browserbugs2 2017-10-28 19:15:04 -0700 2 additional tests (testing a table with realistical tabular data; both border-collapse models tested): http://www.gtalbot.org/BrowserBugsSection/CSS3WritingModes/s73-orthogonal-vrl-table-cells-004.xht http://www.gtalbot.org/BrowserBugsSection/CSS3WritingModes/s73-orthogonal-vrl-table-cells-006.xht The tester must have "Liberation Sans" font or Arial font installed on his/her system. Note that Firefox fails to render 'text-align: left' correctly for cells in orthogonal flow. 1781903 9 eoconnor 2021-08-04 09:38:55 -0700 This is being tracked at W3C in a JLREQ issue: https://github.com/w3c/jlreq/issues/171 Note that this has been fixed in Blink recently (June 2021). 1781904 10 webkit-bug-importer 2021-08-04 09:39:14 -0700 <rdar://problem/81518948> 1781999 11 browserbugs2 2021-08-04 12:27:07 -0700 More tests: http://www.gtalbot.org/BrowserBugsSection/CSS3WritingModes/s73-orthogonal-table-cell-003.xht http://test.csswg.org/harness/test/css-writing-modes-3_dev/single/orthogonal-parent-shrink-to-fit-001/ is 24 sub-tests on shrink-to-fit inline-blocks, floats, table-cells, block boxes with an orthogonal child. 1885329 12 tkent 2022-07-20 01:18:41 -0700 *** Bug 201096 has been marked as a duplicate of this bug. *** 1885332 13 tkent 2022-07-20 01:18:51 -0700 *** Bug 240418 has been marked as a duplicate of this bug. *** 1967360 14 mmaxfield 2023-07-19 09:12:33 -0700 This is important for klreq. See https://w3c.github.io/klreq/gap-analysis/#issue52_vertical_text 2002277 15 ahmad.saleem792 2023-12-29 22:35:01 -0800 @Alan - Will this be fixed by? https://github.com/WebKit/WebKit/commit/0d695812f5b0daef531a9760903457364d2265ff 2002300 16 zalan 2023-12-30 06:07:38 -0800 (In reply to Ahmad Saleem from comment #15) > @Alan - Will this be fixed by? > > https://github.com/WebKit/WebKit/commit/ > 0d695812f5b0daef531a9760903457364d2265ff Sadly no. this looks like a mess now. Will look into it. 2121772 17 475483 fantasai.bugs 2025-06-04 13:13:30 -0700 Created attachment 475483 testcase with variations and visual reference 2162092 18 ayagawap 2025-11-30 21:53:52 -0800 I can confirm that this issue is still reproducible in the latest version of Safari. Chrome renders the layout correctly according to the specification, so this is clearly an Interop issue. 103355 2011-08-09 06:44:24 -0700 2011-08-09 06:44:24 -0700 Table cell with writing-mode:vertical-rl applied vert-table.htm text/html 495 kojii 77u/PCFET0NUWVBFIGh0bWw+DQo8aHRtbCB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94 aHRtbCIgPg0KPGhlYWQ+DQogICAgPHRpdGxlPlVudGl0bGVkIFBhZ2U8L3RpdGxlPg0KICAgIDxz dHlsZSB0eXBlPSJ0ZXh0L2NzcyI+DQogICAgICAgIC52IHsgd3JpdGluZy1tb2RlOnRiLXJsOyAt d2Via2l0LXdyaXRpbmctbW9kZTp2ZXJ0aWNhbC1ybDsgaGVpZ2h0OjFlbTsgfQ0KICAgICAgICB0 ZCB7IGJvcmRlcjoxcHggc29saWQgYmxhY2s7IH0NCiAgICA8L3N0eWxlPg0KPC9oZWFkPg0KPGJv ZHk+DQo8dGFibGU+DQogIDx0cj48dGQ+QTwvdGQ+PHRkIGNsYXNzPSJ2Ij5BPC90ZD48dGQ+QXBw bHkgd3JpdGluZy1tb2RlIHRvIHRkPC90ZD48L3RyPg0KICA8dHI+PHRkPkE8L3RkPjx0ZD48cCBj bGFzcz0idiI+QTwvcD48L3RkPjx0ZD5BcHBseSB3cml0aW5nLW1vZGUgdG8gcCBpbnNpZGUgdGQ8 L3RkPjwvdHI+DQo8L3RhYmxlPg0KPC9ib2R5Pg0KPC9odG1sPg0K 121566 2012-01-07 20:47:10 -0800 2012-01-07 20:47:10 -0800 writing-mode:vertical-rl test on td and th tags. td-vertical-test.html text/html 1226 rasamassen PCFkb2N0eXBlIGh0bWw+DQo8aHRtbD48aGVhZD4NCjx0aXRsZT53cml0aW5nLW1vZGUgdGVzdDwv dGl0bGU+DQo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPg0KdGFibGUgeyBib3JkZXItY29sbGFwc2U6 IGNvbGxhcHNlOyBib3JkZXItc3BhY2luZzogMDsgfQ0KLnZlcnRpY2FsLXRleHQgeyAtd2Via2l0 LXdyaXRpbmctbW9kZTp2ZXJ0aWNhbC1ybDsgd3JpdGluZy1tb2RlOiB2ZXJ0aWNhbC1ybDsgfQ0K dGQsIHRoIHsgYm9yZGVyOiAxcHggc29saWQgYmxhY2s7IH0NCjwvc3R5bGU+DQo8L2hlYWQ+DQo8 Ym9keT4NCjxwPlRoZSBmaXJzdCByb3cgaXMgJmx0O3RoJmd0OyB0YWdzIHdpdGggdmVydGljYWwg dGV4dC4gVGhlIHNlY29uZCByb3cgaXMgbm9ybWFsICZsdDt0aCZndDsgdGFncy4gVGhlIHRoaXJk IHJvdyBpcyAmbHQ7dGQmZ3Q7IHRhZ3Mgd2l0aCB2ZXJ0aWNhbCB0ZXh0LiBUaGUgZm91cnRoIHJv dyBpcyBub3JtYWwgJmx0O3RkJmd0OyB0YWdzLjwvcD4NCjx0YWJsZT4NCjx0cj48dGggY2xhc3M9 InZlcnRpY2FsLXRleHQiPmE8L3RoPjx0aCBjbGFzcz0idmVydGljYWwtdGV4dCI+a2xtbm88L3Ro Pjx0aCBjbGFzcz0idmVydGljYWwtdGV4dCI+b3BxcnN0dXZ3eHl6PC90aD48dGggY2xhc3M9InZl cnRpY2FsLXRleHQiPmtsbW5vcHFyczwvdGg+PHRoIGNsYXNzPSJ2ZXJ0aWNhbC10ZXh0Ij5vcHFy c3R1dnd4eXo8L3RoPjwvdHI+DQo8dHI+PHRoPmE8L3RoPjx0aD5rbG1ubzwvdGg+PHRoPmE8L3Ro Pjx0aD5hPC90aD48dGg+Zm9vYmFyPC90aD48L3RyPg0KPHRyPjx0ZCBjbGFzcz0idmVydGljYWwt dGV4dCI+YTwvdGQ+PHRkIGNsYXNzPSJ2ZXJ0aWNhbC10ZXh0Ij5rbG1ubzwvdGQ+PHRkIGNsYXNz PSJ2ZXJ0aWNhbC10ZXh0Ij5vcHFyc3R1dnd4eXo8L3RkPjx0ZCBjbGFzcz0idmVydGljYWwtdGV4 dCI+a2xtbm9wcXJzPC90ZD48dGQgY2xhc3M9InZlcnRpY2FsLXRleHQiPm9wcXJzdHV2d3h5ejwv dGQ+PC90cj4NCjx0cj48dGQ+YTwvdGQ+PHRkPmtsbW5vPC90ZD48dGQ+YTwvdGQ+PHRkPmE8L3Rk Pjx0ZD5mb29iYXI8L3RkPjwvdHI+DQo8L3RhYmxlPg0KPHA+VGhlIGJlbG93IHRleHQgaXMgaW4g YSBwYXJhZ3JhcGggdGFnLCBwcm92aW5nIHdyaXRpbmctbW9kZSB3b3JrcyBvbiBwYXJhZ3JhcGgg dGFncyBpbiB3ZWJraXQuPC9wPg0KPHAgY2xhc3M9InZlcnRpY2FsLXRleHQiPlZlcnRpY2FsIHRl eHQgc2FtcGxlPC9wPg0KPC9ib2R5PjwvaHRtbD4= 475483 2025-06-04 13:13:30 -0700 2025-06-04 13:13:30 -0700 testcase with variations and visual reference table-cell-writing-mode.html text/html 390 fantasai.bugs PCFET0NUWVBFIGh0bWw+Cjx0aXRsZT53cml0aW5nLW1vZGUgb24gdGFibGUgY2VsbHM8L3RpdGxl PgoKPHA+QWxsIHRocmVlIGJveGVzIHNob3VsZCByZW5kZXIgdGhlIHNhbWUuPC9wPgoKPHRhYmxl IGJvcmRlcj4KCTx0cj48dGQgc3R5bGU9IndyaXRpbmctbW9kZTogdmVydGljYWwtcmwiPlRoaXMg aXMgYSB0ZXN0Lgo8L3RhYmxlPgoKPHRhYmxlIGJvcmRlcj4KCTx0cj48dGQ+PGRpdiBzdHlsZT0i d3JpdGluZy1tb2RlOiB2ZXJ0aWNhbC1ybCI+VGhpcyBpcyBhIHRlc3QuPC9kaXY+CjwvdGFibGU+ Cgo8dGFibGUgYm9yZGVyIHN0eWxlPSJ0cmFuc2Zvcm0tb3JpZ2luOiBib3R0b20gbGVmdDsgcm90 YXRlOiA5MGRlZyIgPgoJPHRyPjx0ZD5UaGlzIGlzIGEgdGVzdC4KPC90YWJsZT4K