I’m applying writing-mode: vertical-rl; to a div tag containing the word “A중385” but it only changes the direction of “A385” and the word 중 doesn’t change direction. Please help me solve this problem.
I am use css writing-mode: vertical-rl; but it’s not working
this is my sample code:
<code>.vertical{
writing-mode: vertical-lr;
}
<div class="vertical">
A중385
</div>
</code>
<code>.vertical{
writing-mode: vertical-lr;
}
<div class="vertical">
A중385
</div>
</code>
.vertical{
writing-mode: vertical-lr;
}
<div class="vertical">
A중385
</div>
1
Solution I can think of is to manually rotate the 중 ot use text-orientation: sideways
<code>.vertical {
writing-mode: vertical-rl;
text-orientation: mixed;
}
.vertical span.rotate {
display: inline-block;
transform: rotate(90deg);
}
.vertical1 {
writing-mode: vertical-rl;
text-orientation: sideways;
}</code>
<code>.vertical {
writing-mode: vertical-rl;
text-orientation: mixed;
}
.vertical span.rotate {
display: inline-block;
transform: rotate(90deg);
}
.vertical1 {
writing-mode: vertical-rl;
text-orientation: sideways;
}</code>
.vertical {
writing-mode: vertical-rl;
text-orientation: mixed;
}
.vertical span.rotate {
display: inline-block;
transform: rotate(90deg);
}
.vertical1 {
writing-mode: vertical-rl;
text-orientation: sideways;
}
<code><div class="vertical">
A<span class="rotate">중</span>385
</div>
<br> <br>
<div class="vertical1">
A중385
</div></code>
<code><div class="vertical">
A<span class="rotate">중</span>385
</div>
<br> <br>
<div class="vertical1">
A중385
</div></code>
<div class="vertical">
A<span class="rotate">중</span>385
</div>
<br> <br>
<div class="vertical1">
A중385
</div>
1