SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Evangelist dev_cw's Avatar
    Join Date
    Dec 2005
    Posts
    454
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Does letter-spacing: work cross browser?

    I am wondering if letter-spacing: will work cross browser or will additional tweaks be needed?

    I have been handed a design to markup and the designer made a navigation menu with very tight Arial type. I can get it to look right with letter-spacing: but if the spacing shifts it will cause havoc to the design. I could use images, and would if the font was not Arial, but in this case I would like to try to avoid unnecessary images.
    "You can just hang outside in the sun all day tossing a ball around...
    Or you can sit at your computer and do something that matters."
    - Cartman

  2. #2
    SitePoint Guru redhillccwebmas's Avatar
    Join Date
    Jun 2005
    Posts
    989
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    As far as I am aware, letter-spacing is widely supported. I have it currently implemented it on several of my fairly large-scale websites, and it seems to work fine. And the best thing of all is that IE6 supports it, which as any knowledgeable CSS coder will know, is the worst offender when it comes to adhering to standards (that and earlier versions of IE (which I personally haven't tested letter-spacing with)).

    Hope this helps

    James

  3. #3
    SitePoint Addict
    Join Date
    Oct 2004
    Location
    USA, Saratoga Springs, NY
    Posts
    296
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It will work cross-browser, but different browsers will implement the spacing slightly differently depending on a few factors. It took me a bit of toying around with it to get something that was acceptable in the major 5 I was testing in (Safari, Opera 9, IE6, IE7, Firefox 2). Once you start caring about pixel differences in spaces between fonts, rendering engines handle things a bit differently.

    For testing purposes, you could always use something like www.browsershots.org, if that helps.
    They say, "Practice makes perfect," yet they also say, "Nobody's perfect". I don't get it.

  4. #4
    SitePoint Guru redhillccwebmas's Avatar
    Join Date
    Jun 2005
    Posts
    989
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Interesting last comment - what factors determine how different rendering engines interpret letter-spacing?

  5. #5
    SitePoint Addict
    Join Date
    Oct 2004
    Location
    USA, Saratoga Springs, NY
    Posts
    296
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    To be completely honest, I'm not sure. I do know that Firefox will actually attempt to render letter-spacing with values with tenths, and possible hundreths, whereas Opera 9 and IE 7 do not. I can't recall if that was perhaps my problem.

    There's also the factor that certain browsers will read font-size values of percentages differently than point or pixel values (if you're not careful).

    It was quite awhile ago when I was playing with letter-spacing, but it was probably most noticeable between the decimal values.
    They say, "Practice makes perfect," yet they also say, "Nobody's perfect". I don't get it.


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
  •