Click to See Complete Forum and Search --> : CSS font question


larryhead
04-20-2006, 03:58 PM
Hello!

I just finished a site for a client and they are complaining that they want "Helvetica Light" instead of the standard "Helvetica" that I've used. Is this possible to do in CSS? I would really hate to have to use GIF's to accomplish this.


Here is my current font definition btw:

.header_txt {
font-family: Helvetica, Verdana, Geneva, Arial, sans-serif;
font-size: 16pt;
font-weight: normal;
color: #ACACAC;
}


Thanks for any help you guys can provide! :)

devinemke
04-20-2006, 04:03 PM
you can specify whatever font you want in your font-family list. whether that font will be used depends entirely on whether the client has that particular font installed.

larryhead
04-20-2006, 04:12 PM
Hi devinemke, thanks for the reply. Are you suggesting something like:

font-family: Helvetica Light, Helvetica, Verdana, Geneva, Arial, sans-serif;

I wasn't sure if that would actually work... though the browser is supposed to work left to right until it finds a font the client has installed, so maybe it'll work for some people.




Also, I've tested this option out too:
font-weight: lighter;


but unfortunatley it still looks identical to:
font-weight: normal;

:confused:

bpat1434
04-20-2006, 04:50 PM
[b]Note:[b] If a family-name contains white-space, it should be quoted. Single quotes must be used when using the "style" attribute in HTML.

SO your declaration should be:
font-family: 'Helvetica Light', Helvetica, Verdana, Geneva, Arial, sans-serif;

The font-weight attribute can take the form of a digit from 100 to 700 (lighter -> bold). try using 100 as the font-weight (400 is supposed to be "normal") but older browsers (pre IE 4, NN4, FF 1) won't support this though.

larryhead
04-20-2006, 05:17 PM
SO your declaration should be:
font-family: 'Helvetica Light', Helvetica, Verdana, Geneva, Arial, sans-serif;

The font-weight attribute can take the form of a digit from 100 to 700 (lighter -> bold). try using 100 as the font-weight (400 is supposed to be "normal") but older browsers (pre IE 4, NN4, FF 1) won't support this though.

Thanks very much! This worked beautifully. :)

larryhead
04-20-2006, 05:18 PM
[b]Note:[b] If a family-name contains white-space, it should be quoted. Single quotes must be used when using the "style" attribute in HTML.

Also, I check over here and saw they were using double-quotes around the font families w/ whitespace...
http://www.w3.org/TR/REC-CSS2/fonts.html#font-family-prop

So maybe you only need single-quotes if your styles are all inline?

Not sure.. but thanks again for your help!

Weedpacket
04-20-2006, 06:37 PM
If you're using the styles inline - i.e., as HTML attribute values - then the quoting style you use to delimint font-family names would have to be the opposite of the one you're using to quote the attribute values. If your attribute values were single-quoted, then you'd need to use double quotes in the CSS. (The reason for all of this should be obvious :)).