www.webdeveloper.com
Results 1 to 4 of 4

Thread: vertical text

  1. #1
    Join Date
    May 2007
    Location
    Sydney, Australia
    Posts
    37

    vertical text

    hey all,
    at work at the moment- a design for a css table just came in that requires one column of tall, narrow cells to have the text inside typed vertically; that is, rotated anti-clockwise on a 90 degree angle so that the text types 'up' the cell.

    is this possible?
    Thanks in advance

  2. #2
    Join Date
    Nov 2007
    Location
    New York, US
    Posts
    15
    If you don't want to generate an image of the text, the only way to do it using CSS is in IE. Here's what you need for the IE only style

    <h1 style="writing-mode: tb-rl"> or <h1 style="writing-mode: tb-rl; filter: FlipH FlipV;"> for the opposite direction

  3. #3
    Join Date
    Dec 2005
    Location
    American, living in Toronto, ON. CANADA
    Posts
    6,746
    A similar approach:

    Code:
    <style>
    p#vert {margin:25px; padding:5px; width:10px; font-weight:bold; border:1px solid black; text-align:center;}
    #vert span {display:block;}
    </style>

    HTML Code:
    ....<body>
    
    <p id="vert">
    <span>V</span>
    <span>E</span>
    <span>R</span>
    <span>T</span>
    <span>I</span>
    <span>C</span>
    <span>A</span>
    <span>L</span>
    <span style="padding-top:23px;">T</span>
    <span>E</span>
    <span>X</span>
    <span>T</span>
    </p>
    
    
    </body>....

  4. #4
    Join Date
    May 2007
    Location
    Sydney, Australia
    Posts
    37
    thx for the tips- i ended up using images, but both those methods worked well to some extent
    cheers

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles