Firefox compatibility with CSS drop down menu

mattzz

03-01-2007, 07:54 PM

We have just created a new look for our website -- www.joelblock.com.

We had a graphics designer create a PDF document for my business partner (Joel Block) to professionally showcase his speaking ability and his credentials. And she did a great job with that.

To keep things consistent, we asked the same graphics designer to create a menu-based website template that we can use for all the pages of the joelblock.com site. We're now more than 95% of the way to our goal of having a professional site with easy-to-use and easy-to-read menu options.

And this is where we need some assistance from an expert in this forum.

Here are the two main issues that I see right now with www.joelblock.com:

1) Firefox browser -- there is a small letter "v" to the right of the button text for "Speaker" and "Radio Guest". These are the only two buttons that have drop down menus. How do we remove this "v" character?

2) IE 6, IE 7, and Firefox browsers -- After you choose a menu option, this option appears as "grayed out" from that point forward. How do we prevent the menu options from changing color?

Thanks in advance!

Matt

ahallicks

03-01-2007, 08:21 PM

For number 2 get rid of:

a:visited {
text-decoration: none;
font-family: Tahoma;
font-size: 11px;
font-style: normal;
line-height: 12px;
font-weight: bold;
font-variant: normal;
text-transform: none;
color: #666666;
}

in your style sheet. Still working on the first one!

(You've also forgotten to close the link to youre stylesheet ;))

Tricia

03-01-2007, 08:23 PM

1) Firefox browser -- there is a small letter "v" to the right of the button text for "Speaker" and "Radio Guest". These are the only two buttons that have drop down menus. How do we remove this "v" character?

remove this code, its unnecessary if you dont want the "v" in the drop down
.chromestyle ul li a[rel]:after{ /*HTML to indicate drop down link*/
content: " v";
/*content: " " url(downimage.gif); /*uncomment this line to use an image instead*/
}

and
2) IE 6, IE 7, and Firefox browsers -- After you choose a menu option, this option appears as "grayed out" from that point forward. How do we prevent the menu options from changing color?

you have the color for the visited link specified here:
a:visited {
text-decoration: none;
font-family: Tahoma;
font-size: 11px;
font-style: normal;
line-height: 12px;
font-weight: bold;
font-variant: normal;
text-transform: none;
color: #666666;
}

if you change the "color:" to what your nomal link color is, #003333 then you should be good to go.

Excavator

03-01-2007, 08:29 PM

</style>

</head>
<body> 
<div id="wrapper">

<div class="chromes

Validate often DURING development. Use it like a spellchecker.
See the links in my sig below.
======================

This is your V -
.chromestyle ul li a[rel]:after{
/*HTML to indicate drop down link*/
content: " v";
/*content: " " url(downimage.gif); /*uncomment this line to use an image instead*/
}

And I see I'm too slow for the rest, haha

ahallicks

03-01-2007, 08:30 PM

You appear to have an unopen endif in your head section? And what is that strange link in the style section of yourhead?

Tricia

03-01-2007, 08:43 PM

Just an observation/suggestion. I'd make sure the email address and url at the bottom right of the page were clickable, or at the very least selectable. That would irritate me as a user that I couldnt click it to go to that webpage, and I wouldnt take the time to type it in.

mattzz

03-01-2007, 09:18 PM

Thank you all for the prompt replies. I'm going to make the suggested changes and I'll let you know how it goes.

Since I didn't write this code, I have no idea why there is a missing endif (or why any of the other weird things are in there).

Stay tuned...

Matt :thumbsup:

jlhaslip

03-01-2007, 09:36 PM

Tricia

03-02-2007, 01:30 PM

I don't understand what your point is jlhaslip????

ahallicks

03-02-2007, 02:48 PM

I think he's saying that it hasn't been styled/put on the web page as text yet