Chichiri (anchan218) wrote in component_help,
Chichiri
anchan218
component_help

Font Sizes Fix

It seems LJ has changed the way components is setting font sizes and it's screwing up. Components used to hard code all of the fonts to specific pixel values, but if you look at your style sheet now you can see that it sets the background font to .7em and all the others to percentage values (ie they're sized in relationship to whatever your background font is set to). I'm not the best style sheet expert ever, but according to this reference library on HTML, "On the 'font-size' property, 'em' and 'ex' length units refer to the font size of the parent element. On all other properties, they refer to the font size of the current element." I think that means that your 0.7em sets it to 70% the size of the browser setting? *not sure* I'm beginning to think the broswers aren't sure what to do with it either, and so different browsers will render this differently.

I think this will be a temporary problem, however, so hopefully xevinx can keep us updated when they change the font stuff again.

Anyway, to fix it, try replacing the following in your style sheet (a la this tutorial):

body { background-color: #ffffff;

background-image: url("http://www.angelfire.com/scary/froda/sbg.jpg");
background-repeat: no-repeat;
background-position: center;
background-attachment: fixed;

margin-top: 0px; margin-left: 0px;
margin-right: 0px;
font-family: Trebuchet MS, sans-serif;
font-size: .7em;
color: #2d2d2d;
}

with the following:

body { background-color: #ffffff;

background-image: url("http://www.angelfire.com/scary/froda/sbg.jpg");
background-repeat: no-repeat;
background-position: center;
background-attachment: fixed;

margin-top: 0px; margin-left: 0px;
margin-right: 0px;
font-family: Trebuchet MS, sans-serif;
font-size: 14px;
color: #2d2d2d;
}

You'll probably want to play around with the number value of "font-size" so everything looks the way you like it, but this should at least keep fonts standard on all computers and all browsers.

Edit: I just realized some people might just take this code line for line and copy-paste it into their style sheet. However, your style sheet is most likely different from the settings here. Basically I mean change font-size: 0.7em; (or whatever that number is) to font-size: 14px; (or whatever number you feels look best on your journal. in the body{} part of the style sheet.
Subscribe

  • Post a new comment

    Error

    Anonymous comments are disabled in this journal

    switch
    default userpic

    Your reply will be screened

    Help
  • 5 comments