Jasinski Technical Wiki

Navigation

Home Page
Index
All Pages

Quick Search
»
Advanced Search »

Contributor Links

Create a new Page
Administration
File Management
Login/Logout
Your Profile

Other Wiki Sections

Software

PoweredBy

Page History: Rotating Text with CSS

Compare Page Revisions



« Older Revision - Back to Page History - Current Revision


Page Revision: Wed, Sep 21, 2011, 11:56 AM


<html>
<head>
<style>
td
{
    border: 1px solid silver;
}
.rot90
{
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}
.rot180
{
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
}
.rot270
{
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
}
</style>
</head>
<body>
<table border="1">
    <tr>
        <td>Normal text</td>
        <td class='rot90'>Rotated 90</td>
        <td class='rot180'>Rotated 180</td>
        <td class='rot270'>Rotated 270</td>
        <td>Normal text<br/><br/><br/><br/><br/><br/></td>
    </tr>
</table>

</body>
</html>

ScrewTurn Wiki version 3.0.1.400. Some of the icons created by FamFamFam. Except where noted, all contents Copyright © 1999-2021, Patrick Jasinski.