Treehouse: Grow your CSS skills. Land your dream job.

Font defaults in different browsers

  • # August 1, 2011 at 11:14 am

    I’m not sure if this is me just being stupid or an ongoing problem but I made my site in firefox and everything lines up perfectly and everything is in the right places but when I test it in chrome or ie the fonts are messed up, I’m aware chrome renders fonts differently to firefox but I didn’t think that would affect the length of each word, I’m assuming this is something to do with the letter spacing but I’m not sure, the site in question is

    The best example of this would be the logo, in firefox the caption and the title are both the same width where as in chrome the title is longer than the caption.

    If there’s something I’ve missed that I should of done or there’s a cheeky workaround to fix the problem can you please let me know, if there is not then sorry to have wasted your time.

    # August 1, 2011 at 1:50 pm

    The margin/padding is different between browsers too. Try zeroing out heading and paragraph tags and then applying whatever styling you’d like to see if that helps.

    # August 1, 2011 at 1:51 pm

    That is the fault of the browser I’m afraid.

    In Chrome it’s shorter, in IE it’s longer, etc.

    On a side note, I would up the font-size for your body text. It is super small!

    # August 1, 2011 at 2:03 pm

    I don’t think the margin/padding is the issue here as everything is even on the left still, I’ll check it out though and to TheDoc, font size noted I normally work with Tahoma for body text and it’s notably bigger than Georgia, as for my problem I don’t suppose there’s some sort of work around to make them the same or ever closer to looking the same.

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.