Monday, December 30, 2013

After nineteen years of the World Wide Web, we may now rotate text in HTML.

I just watched the 2nd in a series of Scott-Hanselman-made video clips mentioned here and find myself blown away by the modern CSS tricks to rotate text! If you slap the following in a class...

.hyena {
   width: 200px;
   height: 200px;
   color: #00FF00;
   -moz-transform: rotate(45deg);
   -ms-transform: rotate(45deg);
   -o-transform: rotate(45deg);
   -webkit-transform: rotate(45deg);
   transform: rotate(45deg);
}

 
 

...and then decorate a div tag with it like so:

<div class="hyena">Never laugh at a hyena!</div>

 
 

The result is:

Never laugh at a hyena!

No comments:

Post a Comment