Cross-platform CSS issue

I'm using a .css file to format elements in drop-down menus. The font and font
colour are fine on the Mac (IE 5.2) but default to Times and black font colour
on a Windows machine (IE 6). I've had a similar cross-platform issue before
with CSS. I'm creating pages with Dreamweaver MX 2004 on a Mac G4 running OS
10.3. Any solution out there?

TonyRichards wrote:

I'm using a .css file to format elements in drop-down menus. The font and font
colour are fine on the Mac (IE 5.2) but default to Times and black font colour
on a Windows machine (IE 6). I've had a similar cross-platform issue before
with CSS. I'm creating pages with Dreamweaver MX 2004 on a Mac G4 running OS
10.3. Any solution out there?

What font are you trying to use? Can you post a URL to the page so we
can see the code?


Gary

I want to use Arial and set the text colour to white. Here's the URL: http://www.artspring.ca/index_new.htm. The submenu items are fine on the Mac but show up in Times on my PC.

"TonyRichards" <webforumsuser (AT) macromedia (DOT) com> wrote

I want to use Arial and set the text colour to white. Here's
the URL: http://www.artspring.ca/index_new.htm. The submenu
items are fine on the Mac but show up in Times on my PC.

There is an error in your CSS. Here are your style definitions for the menu
items:

..p7submenus a, .p7submenus a:visited {
display: block;
padding: 1px 8px 1px 12px;
background-color: #7087CB;
color: #000000;
text-decoration: none;
border-top: 1px solid #BAAFAB;
border-right: 1px solid #96807A;
border-bottom: 1px solid #96807A;
border-left: 1px solid #BAAFAB;
font: Arial, Helvetica, sans-serif
}
..p7submenus a:hover, .p7submenus a:active, .p7submenus a:focus {
background-color: EB954C;
color: #000000;
border-top: EB954C;
}

First, you mention that you want the text to be white, but both of these say
"color: #000000". That's black. To make it white, change both of those to
"color: #ffffff".

As far as the font, your declaration is this:

font: Arial, Helvetica, sans-serif

If all you are defining is the font family/face, it should be:

font-family: Arial, Helvetica, sans-serif

When you use just font: then you need to specify at LEAST the size and
family, like these examples:

font: small Arial, Helvetica, sans-serif

font: 12px Arial, Helvetica, sans-serif

font: 1em Arial, Helvetica, sans-serif

font: 100% Arial, Helvetica, sans-serif

Fix those two things and you should see what you want.

Gary

Thanks very much, Gary. That works just fine now.

TonyRichards wrote:

Thanks very much, Gary. That works just fine now.

You're welcome. Glad it helped.


Gary