Home >Web Front-end >CSS Tutorial >How to Remove the Dotted Outline from a Select Box in Firefox?
How to Remove the Dotted Outline from a Select Box in Firefox?
- Susan SarandonOriginal
- 2024-11-04 11:12:30973browse
Removing the Outline from a Select Box in Firefox
Question: Is it possible to remove the dotted outline surrounding a selected item in a
CSS Attempt and Failure:
An attempt was made to remove the outline using the outline property in CSS, but it proved ineffective in Firefox.
<style>
select { outline:none; }
</style>
Solution:
To remove the outline in Firefox, apply the following CSS rule:
select:-moz-focusring {
color: transparent;
text-shadow: 0 0 0 #000;
}
This rule targets the Firefox-specific -moz-focusring pseudo-class, making the focus ring transparent and hiding the dotted outline. It's a bulletproof solution that effectively removes the outline solely in Firefox.
The above is the detailed content of How to Remove the Dotted Outline from a Select Box in Firefox?. For more information, please follow other related articles on the PHP Chinese website!