html - Remove outline from select box in FF -
is possible remove dotted line surrounding selected item in select element?

i have tried add outline property in css did not work, @ least not in ff.
<style> select { outline:none; } </style> update
before go ahead , remove outline, please read this.
http://www.outlinenone.com/
i found solution, mother of hacks, serve starting point other more robust solutions. downside (too big in opinion) browser doesn't support text-shadow supports rgba (ie 9) won't render text unless use library such modernizr (not tested, theory).
firefox uses text color determine color of dotted border. if do...
select { color: rgba(0,0,0,0); } firefox render dotted border transparent. of course text transparent too! must somehow display text. text-shadow comes rescue:
select { color: rgba(0,0,0,0); text-shadow: 0 0 0 #000; } we put text shadow no offset , no blur, replaces text. of course older browser don't understand of this, must provide fallback color:
select { color: #000; color: rgba(0,0,0,0); text-shadow: 0 0 0 #000; } this when ie9 comes play: supports rgba not text-shadow, apparently empty select box. version of modernizr text-shadow detection , do...
.no-textshadow select { color: #000; } enjoy.
Comments
Post a Comment