I'm attempting to eliminate the shadow that appears on a select element when it is in focus:
https://i.sstatic.net/5kDKE.png
I have tried the following CSS styles:
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);
}
This is the HTML structure:
<select />
However, these styles do not successfully remove the shadow. Any recommendations?