CODEWITHSUNDEEP
csshtmlfirefox
Ghostff
Ghostff

Reputation: 1458

how to remove required highlights in HTML - Firefox

Is there any way to remove the red border from a required input or textarea in Firefox? this is what i have tried:

HTML

<textarea class="opt" rows="3"placeholder="opt" required></textarea>

CSS

.opt:required:focus
{
    border: 1px solid black;
    outline:none;
}

Fiddle here

Upvotes: 2

Views: 775

Answers (1)

jmore009
jmore009

Reputation: 12933

It's not a border, it's a box-shadow and you can target :invalid:

.opt:invalid {
   box-shadow:none;
}

RUN IN FIREFOX

You can also add:

border: 1px solid black; //or whatever color/style you want

To overwrite the focus highlight as well:

RUN IN FIREFOX - 2

Upvotes: 6

Related Questions