I just discovered a possible bug in Chrome but I am unable to find any resource.
It seems that writing-mode
does not run on BUTTON
tag.
See the living example for details.
<a href="#;" class="pippo">pippo</a>
<br><br>
<button class="pippo">pippo</button>
.pippo {
writing-mode:vertical-lr
}
Is there any workaround to fix it in Chrome (in Firefox runs correctly)?
In CSS, to work with writing modes we use the writing-mode property. This property can take the following values: horizontal-tb. vertical-rl.
vertical-lr. For ltr scripts, content flows vertically from top to bottom, and the next vertical line is positioned to the right of the previous line. For rtl scripts, content flows vertically from bottom to top, and the next vertical line is positioned to the left of the previous line.
questions. vertical-lr:This mode lets the content flow vertically from top to bottom, horizontally from left to right. The next vertical line is positioned to the right of the previous line.
To achieve a vertical text orientation, set the writing mode property to vertical-lr(or vertical-rl) and set text-orientation to upright.
You can try this:
<button><p style="writing-mode:vertical-lr;">pippo</p></button>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With