64608 2011-07-15 11:29:58 -0700 (writing modes) Orthogonal flows which overflow should be wrapped into columns in the flow direction of the containing block 2024-06-06 14:19:41 -0700 1 1 1 Unclassified WebKit CSS 528+ (Nightly build) All All NEW http://dev.w3.org/csswg/css3-writing-modes/#orthogonal-multicol HasReduction, InRadar, LayoutTestFailure P2 Normal --- 93304 1 eoconnor webkit-unassigned ahmad.saleem792 ap bfulgham browserbugs2 hyatt rniwa shanestephens simon.fraser webkit-bug-importer zalan oldest_to_newest 437852 0 101012 eoconnor 2011-07-15 11:29:58 -0700 Created attachment 101012 Demo of current behavior See §7.3.2. Multi-column Layout in Orthogonal Flows of CSS3 Writing Modes: http://dev.w3.org/csswg/css3-writing-modes/#orthogonal-multicol 437856 1 eoconnor 2011-07-15 11:35:13 -0700 <rdar://problem/9783787> 1332535 2 browserbugs2 2017-07-26 19:27:59 -0700 1- The description of what the test should lay out (expected results) is not clear, is not explicit: "This document should not be T-shaped". 2- FWIW, I get the same layout in both Firefox 54 and Chrome 60, once I add unprefixed property names: |¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯| | Containing flow | | | ----------------------------------- | | | | | | | | | | | | | | | | | | | | | | | | ----------------------------------- | | | Containing flow | | | ----------------------- 3- The original section regarding multi-column element in orthogonal flow "7.3.2 Auto-sizing Block Containers in Orthogonal Flows" was at-risk https://www.w3.org/TR/css-writing-modes-3/#auto-multicol and is no longer in the Editor's draft: " Deferred the automatic multi-column behavior of orthogonal flows to Level 4. " https://drafts.csswg.org/css-writing-modes-3/#changes-201512 4- Therefore, I think P2 is not justified. 1608506 3 browserbugs2 2020-01-18 18:04:57 -0800 I revisited this bug report and now understand what "This document should not be T-shaped" means, refers to. I have developed related [multi-column containers in orthogonal flow] tests in http://www.gtalbot.org/BrowserBugsSection/CSS4WritingModes/ and there are a few others in orthogonal multi-column with a vertical writing-mode computes height to fill page rather than wrap contents https://bugzilla.mozilla.org/show_bug.cgi?id=1269152 and I hope to develop more tests later. 1895658 4 ahmad.saleem792 2022-09-01 17:04:54 -0700 Test case - http://www.gtalbot.org/BrowserBugsSection/CSS4WritingModes/orthogonal-flow-multi-column-002.html *** Safari Technology Preview 152 ** Show Red Text and green box / square below *** Chrome Canary 107 *** Red stripes or patches and Green box / square below *** Firefox Nightly 106 *** (Expected Behavior) Just single green box / square and no "RED" ______ Test Case - http://www.gtalbot.org/BrowserBugsSection/CSS4WritingModes/orthogonal-flow-multi-column-003.html *** Safari Technology Preview 152 ** Just text and no black square *** Chrome Canary 107 *** Three black patches *** Firefox Nightly 106 *** (Expected Behavior) Single Black Box _____ Test Case - http://www.gtalbot.org/BrowserBugsSection/CSS4WritingModes/orthogonal-flow-multi-column-004.html *** Safari Technology Preview 152 ** Just text and no black square *** Chrome Canary 107 *** Four black small boxes *** Firefox Nightly 106 *** (Expected Behavior???) Single Black Patch elongated and not Square but more of rectangle _________ As for attached "DEMO", it does show similar behavior in Chrome Canary 107 and Safari TP 152 but Firefox does not honour -webkit- prefix. Thanks! 1895662 5 browserbugs2 2022-09-01 17:21:44 -0700 (In reply to Ahmad Saleem from comment #4) > Test Case - > http://www.gtalbot.org/BrowserBugsSection/CSS4WritingModes/orthogonal-flow- > multi-column-003.html > > *** Safari Technology Preview 152 ** > > Just text and no black square Ahmad, You need to install the Ahem font on your testing computer. I even wrote about it in the test: Ahem font can be downloaded from http://www.w3.org/Style/CSS/Test/Fonts/Ahem/ and then install AHEM____.TTF 2017-01-31 20:55 22K > Test Case - > http://www.gtalbot.org/BrowserBugsSection/CSS4WritingModes/orthogonal-flow- > multi-column-004.html > > *** Safari Technology Preview 152 ** > > Just text and no black square Same thing here. Just install Ahem font and try again. 1895664 6 ahmad.saleem792 2022-09-01 17:30:33 -0700 (In reply to Gérard Talbot from comment #5) > (In reply to Ahmad Saleem from comment #4) > > > Test Case - > > http://www.gtalbot.org/BrowserBugsSection/CSS4WritingModes/orthogonal-flow- > > multi-column-003.html > > > > *** Safari Technology Preview 152 ** > > > > Just text and no black square > > Ahmad, > > You need to install the Ahem font on your testing computer. > I even wrote about it in the test: > > Ahem font can be downloaded from > http://www.w3.org/Style/CSS/Test/Fonts/Ahem/ > and then install AHEM____.TTF 2017-01-31 20:55 22K > > > > Test Case - > > http://www.gtalbot.org/BrowserBugsSection/CSS4WritingModes/orthogonal-flow- > > multi-column-004.html > > > > *** Safari Technology Preview 152 ** > > > > Just text and no black square > > Same thing here. Just install Ahem font > and try again. For some reasons - it is not getting utilised by Safari because my font book is reflecting that I have it installed. Weird!!! 1895941 7 ap 2022-09-02 17:54:59 -0700 Safari doesn't load user installed fonts (to reduce fingerprinting). So the test has to include it as a webfont. 1912082 8 ahmad.saleem792 2022-11-13 05:30:58 -0800 I changed the tests to JSFiddle and used ahem.js to make it more easier to reproduce: Test Case - https://jsfiddle.net/p6gq7voy/show Based of Test case - http://www.gtalbot.org/BrowserBugsSection/CSS4WritingModes/orthogonal-flow-multi-column-002.html *** Safari Technology Preview 157 *** Fail *** Chrome Canary 110 *** Fail *** Firefox Nightly 108 *** Pass - Green Square ____ Test Case - https://jsfiddle.net/th4kxr7p/show Based of http://www.gtalbot.org/BrowserBugsSection/CSS4WritingModes/orthogonal-flow-multi-column-003.html *** Safari Technology Preview 157 *** Fail *** Chrome Canary 110 *** Fail *** Firefox Nightly 108 *** Pass - Green Square ____ Test Case - https://jsfiddle.net/1kobv8Le/show Based of http://www.gtalbot.org/BrowserBugsSection/CSS4WritingModes/orthogonal-flow-multi-column-004.html *** Safari Technology Preview 157 *** Fail *** Chrome Canary 110 *** Fail *** Firefox Nightly 108 *** No single black *square* but rectangle ____ Just wanted to update latest results. 2040157 9 webkit-bug-importer 2024-06-06 14:19:41 -0700 <rdar://problem/129363375> 101012 2011-07-15 11:29:58 -0700 2011-07-15 11:29:58 -0700 Demo of current behavior orthogonal-flow-multicol.html text/html 651 eoconnor PCFET0NUWVBFIGh0bWw+CjxodG1sIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hodG1s Ij4KPGhlYWQ+Cjx0aXRsZT5PcnRob2dvbmFsIGZsb3dzICYgbXVsdGljb2wgZGVtbzwvdGl0bGU+ CjxzdHlsZT4KICBib2R5IHsKICAgIC13ZWJraXQtd3JpdGluZy1tb2RlOiBob3Jpem9udGFsLXRi OwogIH0KICBib2R5ID4gZGl2IHsKICAgIHdpZHRoOiAxMGVtOwogICAgYm9yZGVyOiAxcHggc29s aWQgYmxhY2s7CiAgfQogIGRpdiA+IGRpdiB7CiAgICAtd2Via2l0LXdyaXRpbmctbW9kZTogdmVy dGljYWwtcmw7CiAgICBib3JkZXI6IDFweCBzb2xpZCByZWQ7CiAgfQo8L3N0eWxlPgo8L2hlYWQ+ Cjxib2R5Pgo8ZGl2Pgo8cD5Db250YWluaW5nIGZsb3c8L3A+CjxkaXY+CjxwPkN1cnJlbnQgYmVo YXZpb3I8L3A+CjxwPlRoaXMgZG9jdW1lbnQgc2hvdWxkIG5vdCBiZSBULXNoYXBlZC48L3A+Cjxw PkN1cnJlbnQgYmVoYXZpb3I8L3A+CjxwPkN1cnJlbnQgYmVoYXZpb3I8L3A+CjxwPkN1cnJlbnQg YmVoYXZpb3I8L3A+CjxwPkN1cnJlbnQgYmVoYXZpb3I8L3A+CjxwPkN1cnJlbnQgYmVoYXZpb3I8 L3A+CjxwPkN1cnJlbnQgYmVoYXZpb3I8L3A+CjwvZGl2Pgo8cD5Db250YWluaW5nIGZsb3c8L3A+ CjwvZGl2Pgo8L2JvZHk+CjwvaHRtbD4K