Vertical font

liunx

Guest
Hello,

I wonder how to set vertical font. Is it possible or do I need to purchase special font for that?

Thanks for any help,

MikeAfter reading the CSS2 reference at <!-- w --><a class="postlink" href="http://www.w3schools.com">www.w3schools.com</a><!-- w -->, there doesn't seem to be a way to write text vertically on the screen. You can set the text to be displayed left to right, or right to left, though.

If there is a font out there that displays letters vertically, or at least rotated 90 degrees, that would work, but then you'd have to get into downloadable fonts.

Your best bet is to create that text in a graphics program like Photoshop or Paint Shop Pro. You may even be able to do text vertically in Flash.Yes,

I was kind of hoping that I could do it with CSS, but if not, I will just make gif's in Photoshop.

Thanks for your reply.

Mikeyou could make a div which is so narrow that the single characters have to line up vertically. Quite a hack and not tested with many browsers, but it worked for me and some Japanese characters..Hi there kariba,

here is a javascript solution...
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<style type="text/css">
#vertical {
width:40px;
padding:10px 0;
background-color:#000;
font-family:verdana,arial,helvetica,sans-serif;
font-size:16px;
color:#fff;
text-align:center;
}
.hide {
display:none;
}
</style>

<script type="text/javascript">
window.onload=function() {
verticalText();
}
function verticalText(){
userString='This string will be vertically rendered';

for(c=0;c<userString.length;c++) {
document.getElementById('vertical').innerHTML+=userString.charAt(c)+'<br\/>';
}
document.getElementById('vertical').className='';
}
</script>

</head>
<body>

<div id="vertical" class="hide"></div>

</body>
</html>
cootheadI could have thought that I read a page that idealized the notion that using the charset-iso of "traditional chinese" (vertical text) could be used, but with English letters, and achieve this. I didn't bookmark or give it much interest though... It sounds like a "cssplay" thing but I cannot say for sure... :confused:
 
Back
Top