SitePoint Sponsor

User Tag List

Results 1 to 11 of 11
  1. #1
    SitePoint Member
    Join Date
    May 2002
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Exclamation Can text be rotated 90 degrees with CSS?

    Designing a page that will need to be localized for various languags....can't make a vertical tab with text a graphic.....does anyone know if it is possible to rotate text 90 degrees on a page using CSS or other means...thanks for the help

  2. #2
    SitePoint Wizard Bill Posters's Avatar
    Join Date
    Dec 2001
    Location
    UK
    Posts
    1,523
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Nope, you can't.

    What's the problem with using the 'graphic' method?
    New Plastic Arts: Visual Communication | DesignateOnline

    Mate went to NY and all he got me was this lousy signature

  3. #3
    SitePoint Member
    Join Date
    May 2002
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    the problem with using the graphic is that this is a page that will need to be localized to various languages by others not involved in the development...would like to minimize the problme of creating a new graphic for every language needed. Thought that is this was possible through some coding language that it would only be an issue of changing the text and not having to rebuild the graphic.

  4. #4
    Prolific Blogger silver trophy Technosailor's Avatar
    Join Date
    Jun 2001
    Location
    Before These Crowded Streets
    Posts
    9,446
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If you use layering and save the file with it's layers as well as the JPG or GIF you'll use on the site, then creating a new tab is a 5 second deal.

    Sketch
    Aaron Brazell
    Technosailor



  5. #5
    SitePoint Member
    Join Date
    May 2002
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for the info....found out it is possible (only in IE, but possible)...

    <DIV STYLE="writing-mode:tb-rl">


    Thanks again for the help.

  6. #6
    SitePoint Wizard Bill Posters's Avatar
    Join Date
    Dec 2001
    Location
    UK
    Posts
    1,523
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I stand (or rather- sit) corrected(ish).

    Any chance you can make a post and attach a screenshot of this in use?
    New Plastic Arts: Visual Communication | DesignateOnline

    Mate went to NY and all he got me was this lousy signature

  7. #7
    SitePoint Wizard creole's Avatar
    Join Date
    Oct 2000
    Location
    Nashvegas Baby!
    Posts
    7,845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It doesn't work yet Bill...at least I don't think so...or maybe only in IE 6 for PC.
    Adobe Certified Coldfusion MX 7 Developer
    Adobe Certified Advanced Coldfusion MX Developer
    My Blog (new) | My Family | My Freelance | My Recipes

  8. #8
    SitePoint Wizard Bill Posters's Avatar
    Join Date
    Dec 2001
    Location
    UK
    Posts
    1,523
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by creole
    It doesn't work yet Bill...at least I don't think so...or maybe only in IE 6 for PC.
    ...which is why I asked for a screenshot rather than a url, creole
    New Plastic Arts: Visual Communication | DesignateOnline

    Mate went to NY and all he got me was this lousy signature

  9. #9
    SitePoint Wizard
    Join Date
    Oct 2001
    Location
    Tucson, Arizona
    Posts
    1,858
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The line of code I used was simply this...
    Code:
    <div style="font-size: 40px; writing-mode:tb-rl;">testing some text</div>
    ...which produced the output seen below:


  10. #10
    SitePoint Wizard creole's Avatar
    Join Date
    Oct 2000
    Location
    Nashvegas Baby!
    Posts
    7,845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes, but was pswright referring to the entire word rotated or each individual letter?

    L
    I
    K
    E

    S
    O
    ?
    Adobe Certified Coldfusion MX 7 Developer
    Adobe Certified Advanced Coldfusion MX Developer
    My Blog (new) | My Family | My Freelance | My Recipes

  11. #11
    Currently Occupied; Till Sunda Andrew-J2000's Avatar
    Join Date
    Aug 2001
    Location
    London
    Posts
    2,475
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yea that wont work, but you can do this with javascript, reading innerHTML and then printing each char with a line break in between.

    Thats an alternative


Bookmarks

Posting Permissions

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