Welcome to WebmasterWorld Guest from 107.22.14.254

Forum Moderators: not2easy

Message Too Old, No Replies

rotate text using CSS or table

     
1:40 am on Aug 2, 2002 (gmt 0)

10+ Year Member



I would like to create the following using either CSS or a table based design. The only only problem: the LABEL on the left should be rotated by 90 degree, so it reads from bottom to top.

H E A D E R
L afd asdf asdfas aa
A adsfasdf asdfasd s
B asdfasdf asdfaaaaa
E dfasasdfasdffaa aa
L aas ssd aaaaaa aaa

L afd asdf asdfas aa
A adsfasdf asdfasd s
B asdfasdf asdfaaaaa
E dfasasdfasdffaa aa
L aas ssd aaaaaa aaa

Speaking in terms of table, I would use:

<tr><td colspan=2>Header</td></tr>
<tr><td>label</td><td>content content content</td></tr>

So anything I could use to get the "label" rotated?

1:55 am on Aug 2, 2002 (gmt 0)

10+ Year Member



a gif? (for the lable) Haven't seen a css transform for rotate. Might be a dhtml solution also.
6:10 am on Aug 2, 2002 (gmt 0)

WebmasterWorld Senior Member nick_w is a WebmasterWorld Top Contributor of All Time 10+ Year Member



Yes, I'd use a gif too. You could do it in css but it would be far more trouble than it's worth.

Nick

6:49 am on Aug 2, 2002 (gmt 0)

10+ Year Member



Since you're doing this in tables why not use CSS to define your line height and letter spacing and do your LABEL as

<tr>
<td class="myfixedsize">L<br>E<br>B<br>A<br>L</td>
<td class="myfixedsize">
text line 1<br>
text line 2<br>
text line 3<br>
(etc.)
</td></tr>

They'd line up perfectly so long as you specified your formatting via CSS for height, width, line-height, etc. (Well... they should, anyway.) Lots faster to change than a gif!

<edit>duh - now I see. Nevermind. You want the letters themselves on their side, right?</edit>

8:58 am on Aug 2, 2002 (gmt 0)

10+ Year Member



I think it may be possible in Internet Exploder ;) but I'd think twice about doing it. It is fantastically difficult to read on screen.
 

Featured Threads

Hot Threads This Week

Hot Threads This Month