duplicating font family + size

[valarcher]

Hi - please can someone tell me the font size + family used on this page:

http://www.supersmart.co.za/news/ins...estic-workers/

For main content beginning "Domestic workers, who are among the most financially vulnerable"

When I inspect with firebug I get this:

{
font-family:Lucida Grande,Verdana,Helvetica,Arial,sans-serif;
line-height:140%;
}

but I'm unable to duplicate that easy-to-read small font size on my page when I use this:

font: 0.9em "Lucida Grande",Verdana,Helvetica,Arial,sans-serif; color: black; line-height: 140%;

thanks! - Val

[ScallioXTX]

but I'm unable to duplicate that easy-to-read small font size on my page when I use this:

font: 0.9em "Lucida Grande",Verdana,Helvetica,Arial,sans-serif; color: black; line-height: 140%;

They appear to use 10pt "Lucida Grande", which could definitely be something else than 0.9em (depending on the font-size of the ancestor div/span/whatever).

Please note that "em" is a relative font-size, while "pt" is an absolute font size. ie. if you want 10pt font size using 0.9em and the text is directly in the body, the body should have a font size of about 11px

[RyanReese]

Hi - please can someone tell me the font size + family used on this page:

http://www.supersmart.co.za/news/ins...estic-workers/

For main content beginning "Domestic workers, who are among the most financially vulnerable"

When I inspect with firebug I get this:

{
font-family:Lucida Grande,Verdana,Helvetica,Arial,sans-serif;
line-height:140%;
}

It is also probably inheriting other styles, if you were to scrolldown on the right column you would see more styles that are ggetting applied to it .

[ScallioXTX]

It is also probably inheriting other styles, if you were to scrolldown on the right column you would see more styles that are ggetting applied to it .

I also noticed that but they are all crossed out because the last two elements overwrite everything there.

PS. Their site is truely a CSS hell, way too much selectors and ancestors IMHO.

[RyanReese]

And invalid markup .

The span inside of the <p> changes the color t oblack, and to 10pt font size

color:black;
font-family:Lucida Grande,Verdana,Helvetica,Arial,sans-serif;
line-height:140%;
font-size:10pt;}

[valarcher]

thank you! I managed to duplicate it. I think the problem is Lucida Grande doesn't come with windows. The fix is here:

http://www.brownbatterystudios.com/s...e-alternative/

It's a lovely font, fits more text into a line than verdana - it's smaller, fatter, darker, easy to read.

Val

[RyanReese]

ACtually I'm on windows, and I duplicated it .

[valarcher]

Yes but the fix gives a beautiful italic!

[RyanReese]

Indeed. If you have any more questions just ask .

[valarcher]

Thanks! I forgot to mention that in his later update here:

http://www.brownbatterystudios.com/s...rid-revisited/

he writes: "put ‘Hybrid to use, if only to account for that unknown percentage of computers still with the sub-par ‘Sans."

My config (toshiba L300 w Vista) is in that unknown percentage - "Lucida Grande",Verdana - just displays as verdana!

I'm so happy to have found such an easy-to-read font that fits more characters in line than verdana (which was specifically designed for web reading at smaller sizes) AND has such beautiful italic with the fix, whereas verdana italic is boring. My site is very info-rich so I needed a good legible font.

Here's the fix for anyone wanting to try it, from:

http://www.brownbatterystudios.com/s...e-alternative/

body {
font-family: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
}

strong, em, b, i {
font-family: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
}