...

View Full Version : Avoid dotted outlines on selection boxes in Firefox



mypointofview
10-31-2007, 07:25 AM
How to avoid dotted outlines in Firefox when using a drop down menu?

I know how to do it for normal links but I want to get rid of the dots for the selected item in a drop down menu.


<select class="noprint drop" name="visitorLanguage">
<option value="english">English</option>
<option value="french">Fran&ccedil;ais</option>
<option value="german">Deutsch</option>
</select>

With "noprint" I exclude the box from printing and with "drop" I style the size and font color.

Please - if somebody could help me it would be great. I'm a designer and these dots just would hinder the accessibility to my art because they are distracting.

I have tried the trick "outline: none;" and "-moz-outline: none;" and I've played with "focus" etc, but it seems that nothing works.

Can it even be done?

EDIT: after another search (http://www.comptechdoc.org/independent/web/cgi/javamanual/javaselect.html) I experimented with the following which at least avoids the dotted lines after the visitor has chosen from the menu. I added the onchange event using JavaScript (CSS seems at a loss in this case). However the dotted lines appear still when the menu is open:


<select class="noprint drop" name="visitorLanguage" onchange="blur()">
<option value="english">English</option>
<option value="french">Fran&ccedil;ais</option>
<option value="german">Deutsch</option>
</select>



Thanks



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum