Writing mode property in CSS3

How to write the text using writing mode in CSS

Writing mode

It creates the horizontal and vertical alignment of the text

Vertical alignment of text

It creates text in vertical shape by using vertical lr and vertical rl

<style>
    .class1 {
  writing-mode: vertical-rl;
}
    .class2{
        writing-mode:vertical-lr;
    }
</style>
</head>
<body>
    <p class="class1">TechFunda is a free How to web technologies tutorials website. Enjoy your learning in How to manner that are based on real time problem solutions. If you have a how to problem to ask, please ask here.</p>
    <p class="class2">TechFunda is a free How to web technologies tutorials website. Enjoy your learning in How to manner that are based on real time problem solutions. If you have a how to problem to ask, please ask here.</p>
</body>

In the above code snippet we have created writing mode of the text using vertical-lr and vertical rl, it creates text in vertical shape in reverse order and correct order

output

Horizontal alignment of text

It creates text in horizontal shape

<style>
        .class1 {
      writing-mode: horizontal-tb;
    }
        
    </style>
    </head>
    <body>
        <p><i>Writing mode in horizontal line</i></p>
        <p class="class1">TechFunda is a free How to web technologies tutorials website. Enjoy your learning in How to manner that are based on real time problem solutions. If you have a how to problem to ask, please ask here.</p>
    </body>

Horizontal

In the above code snippet we have defined the text in horizontal line using property writing mode as horizontal-tb, which creates text in horizontal line

output