Remove Safari/Chrome select focused shadow

Question

I'm trying to remove the following shadow from a select when it's focused:

I've set:

select {
    border: none;
    box-shadow: none;
    -webkit-box-shadow: none;
    outline: none;
    -webkit-appearance:none;
    -moz-appearance:none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

HTML:

<select />

But those don't work. Any suggestions?

Answer 1

Use the following style:

select:focus {
    outline: none;
}

Or this, for all form elements:

input:focus,
select:focus,
textarea:focus {
    outline: none;
}

Answer 2

the solution for me was:

box-shadow: none !important;

Somehow it wasn't taking the box-shadow I've set before adding !important

Now it's not showing the "glow" anymore.

Thanks for the replies anyway,

Dem