Remove outline from select box in FF

Martin picture Martin · Sep 22, 2010 · Viewed 96.8k times · Source

Is it possible to remove the dotted line surrounding a selected item in a select element?

alt text

I have tried to add the outline property in CSS but it did not work, at least not in FF.

<style>
   select { outline:none; }
</style>

Update
Before you go ahead and remove the outline, please read this.
http://www.outlinenone.com/

Answer

Fleshgrinder picture Fleshgrinder · Sep 17, 2013

Well, Duopixel’s answer is plain perfect. If we go a step further we can make it bulletproof.

select:-moz-focusring {
    color: transparent;
    text-shadow: 0 0 0 #000;
}

There you go, only valid for Firefox and the ugly dotted outline around the selected option is gone.