Vertical Text with CSS

27 Feb

You may looking for how to write vertical text with CSS. I was also looking for this some days before. After searching on google I found the solution how to make vertical text with CSS properties.

Vertical Text with CSS

Vertical Text with CSS

This is tested on Opera 10.5, Firefox 10.0, IE8+ and Webkit based browsers (Safari, chrome etc), so that is pretty encompassing.

This is the HTML markup text

This is a vertical text.

Here is the CSS class property for vertical text with css

width: 20px;

Line 1: For webkit browsers like Safari, Chrome etc.
Line 2: For Mozilla Firefox
Line 3: For Opera
Line 6: For IE
You need to definately specify the CSS white-space and width property to make the text vertical.


Posted by on February 27, 2012 in Uncategorized


Tags: ,

2 responses to “Vertical Text with CSS

  1. Mathieu

    April 5, 2018 at 4:08 pm

    Thank you for your post ! but after the copy of the CSS, how can i do ?

    • Jilani Jidni

      April 5, 2018 at 7:48 pm

      You need to add *vertical-text* class in your text container


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: