I intend to make vertical words using CSS here is a demo:

How can I achieve it?

CodePudding user response：

p {
  writing-mode: vertical-rl;
  text-orientation: mixed;
 }

<p>I am some cool text</p>

<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

writing-mode: vertical-rl; text-orientation: mixed;

Reference

CodePudding user response：

You need transform: rotate property. Here you can find more info: [enter link description here][1]

https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/rotate()

CodePudding user response：

You can achieve it with text-orientation:

.txt { 
  writing-mode: vertical-rl;
  text-orientation: mixed;
}

<div class="txt">some text</div>

<iframe name="sif2" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

Source: https://developer.mozilla.org/en-US/docs/Web/CSS/text-orientation