Picnic Website Code Tutorials

CSS Vertical Text Tutorial

Viw Demo

Here Scott Gale explains it some. I simplified it some.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Vertical Text</title>
<style type="text/css">
p {
float:left;
margin:250px 0 0 -150px;
font-size:50px;
-moz-transform:rotate(90deg);
-webkit-transform:rotate(90deg);
-o-transform:rotate(90deg);
}
</style>
<!--[if IE]>
<style type="text/css">
p {
margin:50px 0 0 50px;
background:#fff; /* prevents distorted text */
filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
}
</style>
<![endif]-->
</head>
<body>

<p>I am some vertical text</p>

</body>
</html>

		

Sponsors

Top Donators

Friends of Mine