#1
  1. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Dec 2000
    Posts
    26
    Rep Power
    0

    Question CSS font-family not working with Netscape 4.x


    I'm using unorderd lists <UL> on my site and in my style sheet, I specify a font-family and font-size for this tag. Works fine in IE 5.5 However, under Netscape 4.75, this is ignored and the default Times font is displayed. Any ideas?

    Thanks!

    Here is my CSS:

    BODY { font-family: Verdana, Arial, Helvetica, sans-serif; font-size:12}
    FORMTXT{ font-family:Arial, Helvetica, sans-serif}
    TABLE, TH, TD { font-family: Verdana, Arial, Helvetica, sans-serif; font-size:12}
    H1, H2, H3, H4, H5, H6 { font-family: Verdana, Arial, Helvetica, sans-serif}
    DIV {font-family: Verdana, Arial, Helvetica, sans-serif; font-size:12}
    P {font-family: Verdana, Arial, Helvetica, sans-serif; font-size:12}
    LI {font-family: Verdana, Arial, Helvetica, sans-serif; font-size:12}
    UL {font-family: Verdana, Arial, Helvetica, sans-serif; font-size:12}


    And here is a clip from my HTML:
    This list is inclosed in a Table, if the matters.

    <FONT face="Arial, Helvetica, sans-serif" color="#000000" size="4"><B>
    Best Visor Edge Protection Available!</B></FONT>
    <UL>
    <LI>Patent-pending slider action
    <LI>Cover slides under base for singular footprint
    <LI>100% Titanium -- No Plastic!
    <LI>Scratch-resistant finish
    <LI>Easy stylus access
    <LI>Rigidity for protection against crushing
    <LI>Neoprene interior for protection against drops/collisions
    <LI>Dimensioned specifically for the Handspring Visor Edge
    <LI>Size: 5" x 3.25" x 0.75"
    <LI>Weight: approx. 5 oz
    </UL>
  2. #2
  3. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Jun 2001
    Location
    Toronto, Ontario, Canada
    Posts
    631
    Rep Power
    14
    This could be for 2 reasons:

    1) NS4 sucks with CSS (not completely supported)

    or

    2) Take out the spaces (probably won't change anything, but i heard you should do this somewhere) so the CSS would look like this:
    Code:
    BODY{font-family:Verdana,Arial,Helvetica,sans-serif;font-size:12} 
    FORMTXT{font-family:Arial,Helvetica,sans-serif} 
    TABLE,TH,TD{font-family:Verdana,Arial,Helvetica,sans-serif;font-size:12} 
    H1,H2,H3,H4,H5,H6{font-family:Verdana,Arial,Helvetica,sans-serif} 
    DIV{font-family:Verdana,Arial,Helvetica,sans-serif; font-size:12} 
    P{font-family:Verdana,Arial,Helvetica,sans-serif;font-size:12} 
    LI{font-family:Verdana,Arial,Helvetica,sans-serif;font-size:12} 
    UL{font-family:Verdana,Arial,Helvetica,sans-serif;font-size:12}
    Hope his helps
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2001
    Location
    New York
    Posts
    122
    Rep Power
    14
    I see a couple of changes I would make to your css - one critical, one probably not.

    The critical change is this: change your sizes from "12" to "12pt". Netscape is picky about CSS syntax.

    As for the non-critical change: I would close your final declarations with semicolons:
    UL {font-family: Verdana, Arial, Helvetica, sans-serif; font-size:12pt;}

    By the way, rather than mixing css and font-tags, why don't you declare a css class for your bold text?
  6. #4
  7. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2001
    Location
    SF Bay Area
    Posts
    1
    Rep Power
    0
    This proly isn't much of a consolation, but Netscape 4 is very buggy about inheritance, particularlywith lists and tables. Have you tried not defining a style at all for <LI> and seeing whether the style carries over from <UL>?
  8. #5
  9. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2001
    Location
    New York
    Posts
    27
    Rep Power
    0
    I'd say it's definitely the syntax thing.

    try:

    BODY { font-family: Verdana, Arial, Helvetica, sans-serif; font-size:12px;}
    FORMTXT{ font-family:Arial, Helvetica, sans-serif;}
    TABLE, TH, TD { font-family: Verdana, Arial, Helvetica, sans-serif; font-size:12px;}
    H1, H2, H3, H4, H5, H6 { font-family: Verdana, Arial, Helvetica, sans-serif;}
    DIV {font-family: Verdana, Arial, Helvetica, sans-serif; font-size:12px;}
    P {font-family: Verdana, Arial, Helvetica, sans-serif; font-size:12px;}
    LI {font-family: Verdana, Arial, Helvetica, sans-serif; font-size:12px;}
    UL {font-family: Verdana, Arial, Helvetica, sans-serif; font-size:12px;}

    or substitute pt; for px; if that's what you wanted.

    another thing I saw that I'm unclear about is the FORMTXT declaration-
    Is that a class you're specifying? If so, it needs a period before the name, like so:
    .FORMTXT{ font-family:Arial, Helvetica, sans-serif;}

    I also noticed you had the same definitions for alot of elements. Unless you're planning on maybe changing those elements later, you could go ahead and group them all into one definition, the same way you did with all your Header tags...

    -dc

IMN logo majestic logo threadwatch logo seochat tools logo