Cte-640 Compatible Pen

Java How to put a text vertically with CSS?

Here I give you how to put text as vetical using only HTML and CSS.
I hope they can ^ _ ^

first define the styles:

. ColumnaVertical 
 {background-color: # 36648B; 
 color: # eeeeff; 
 font-size: 11; 
 font-weight: bold; 
 text-decoration: none; 
 height: 110px; 
 width: 15px; 
 align: center; 
 vertical-align: bottom 
 valign: middle; 
 padding-bottom: 10px; 
 padding-top: 10px; 
 padding-right : 5px; 
 padding-left: 5px;} 
 
 
. textoVertical { 
 writing-mode: tb-rl;} 
 
 
. Rotate-RigthDown 
 {filter: flipv fliph;} 
 
 
. Rotate-RigthUp 
 {filter: flipv;} 
 
 
. Rotate-writing-LeftDown {
 mode: tb-rl; 
 filter: fliph;} 
 
 
. Rotate-leftup 
} {

Now the code:

 
 \u0026lt;table bgcolor = "white" width = "1000px;" height = "150px" style = "valign: bottom"> \u0026lt;tr style="vertical-align:bottom"> 
 
 \u0026lt;td> 
 \u0026lt;a class = "Rotate-RigthDown textoVertical columnaVertical" href ="#"> right down 
 
 Text \u0026lt;/ a> 
 \u0026lt;/ td> 
 \u0026lt;td> 
 \u0026lt;a class="columnaVertical textoVertical Rotar-RigthUp" href="#"> top right 
 Text 
 \u0026lt;/ a> 
 \u0026lt;/ td> 
 \u0026lt;td> 
 \u0026lt;a class="columnaVertical textoVertical Rotar-LeftDown" href="#"> left below 
 
 Text \u0026lt;/ a> 
 \u0026lt;/ td> 
 \u0026lt;td> 
 \u0026lt;a class="columnaVertical textoVertical Rotar-LeftUp" href="#"> top left 
 
 Text \u0026lt;/ a> 
 \u0026lt;/ td> \u0026lt;td width="100%"> 
 
 
 \u0026lt;/ td> 
 \u0026lt;/ tr> 
 \u0026lt;/ table>