css vaildation error Options

[Navarone]

Ok, I go an validate my web page using the W3C CSS validator and I get this error message:

26 .subpage_text_header Family names containing whitespace should be quoted. If quoting is omitted, any whitespace characters before and after the name are ignored and any sequence of whitespace characters inside the name is converted to a single space.

What the heck does this mean can some one explain this?

the page in question http://dev-alcon.virtualhorizons.com/default.asp

The problem, the drop down menus don't seem to work on Mac's running Safari browser. So I am looking to see if there is some problem with my css. Would the above error prevent my drop down menus from working on Mac's using Safari?

Thanks

[Christian J]

http://dev-alcon.virtualhorizons.com/includes/stylesheet.css

It's the font-family names that need to be quoted if they contain white-space, otherwise the browser may think "Trebuchet" and "MS" are two different fonts:

CODE

font-family: Arial, sans-serif, Trebuchet MS;

Would the above error prevent my drop down menus from working on Mac's using Safari?

Probably not. What happens if you temporarily remove the style sheet?

[Navarone]

You mean like this?

CODE

font-family: Arial, sans-serif, "Trebuchet MS";

Personally I don't think it is the style sheet but I will try removing it and seeing what the results are. I don't use the Mac, my cleint does.

This post has been edited by Navarone: May 25 2007, 08:03 AM

[Christian J]

Yes that's it.

[MDurkee]

What do you mean . . ."Yes that's it" ?? I have had a similar problem with a site that uses dynamic menus and have had no luck finding out what is going on. I also do not have a MAC to test on so don't know what to do about it. Did someone find out what is going on there?

[Frederiek]

If I place the script in the page itself, instead of loading it as an external file, I get this error in Safari:

Object (result of expression openIt) does not allow calls.
http://dev-alcon.virtualhorizons.com/default.asp

refering to line 336, which is:

<div class="knife_products_loc"><a href="#" onMouseOver="openIt('knife')" onMouseOut="closeIt('knife')"><img src="images/menu/knife_products_header.jpg" width="126" height="83" border="0" alt=""></a><br>

Maybe that will be of help to find out why it doesn't work in Safari.

[Christian J]

What do you mean . . ."Yes that's it" ??

I just meant that the quoting of "Trebuchet MS" in Navarone's code sample was correct. But now that I took a closer look the order is possibly wrong, since the generic "sans-serif" font would normally appear last in the list, like this:

CODE

font-family: Arial, "Trebuchet MS", sans-serif;

Not sure if it's mandatory to put it last, http://www.w3.org/TR/CSS21/fonts.html#propdef-font-family just encourages us to "offer a generic font family as a last alternative." But normally last is the only place where it makes sense, though I guess in theory you could offer an obscure generic font before a more common font-family like

CODE

font-family: fantasy, arial, sans-serif; /* assuming fantasy is a poorly supported generic font */

None of this should be related to the OP's drop down menu problem.

Did someone find out what is going on there?

I recall Navarone started a couple of separate threads about the drop down menu problems, possibly they can be of help.