Jay.
Jay.

Reputation: 341

Remove dotted border around focused option in select

How can I remove the dotted border around the focused item in the select box that appears in Firefox (78.0.1). I have tried all suggested solutions but none seem to work.

enter image description here

Here's the css that i have tried:

:focus {
    outline:none;
}

::-moz-focus-inner {
    border:0;
    outline: none; 
}

select {
  color: #000;
  color: rgba(0,0,0,0);
  text-shadow: 0 0 0 #000;
}

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

Here's the JSFiddle Link: https://jsfiddle.net/rs10v72d/

Upvotes: 1

Views: 351

Answers (1)

Azmain Khan
Azmain Khan

Reputation: 55

This happens because of the browser you are using. Some browers have these types of built-in things. Like in the latest version of Google Chrome, when you click on such type of thing, the border becomes fully black.

Upvotes: 1

Related Questions