user2678324
user2678324

Reputation:

outline-style: none doesn't work as a class

I wanted to apply outline-style: none; to all my buttons in my html page. I created a class:

.outlineNone {
    outline-style: none;
}

and assign the class to all my buttons. But it seems not be working. It seems to be only working when I apply the style inline with my html.

Can anyone explain to me why this is happening?

To clarify, I want to get rid of the blue rectangle that appears after you click on a button like the image below:

Screenshot

Upvotes: 1

Views: 445

Answers (2)

arodriguezdonaire
arodriguezdonaire

Reputation: 5562

Try with:

.outlineNone {
    outline-style: none !important;
}

It seems to be a problem with some other structure which is modifying the outline-style that has bigger priority than just a class. (it can be an ID or the Button class itself)

Upvotes: 1

dippas
dippas

Reputation: 60563

instead outline-style just use outline, plus you can reset the button style even more by setting border to 0

like this:

.outlineNone {
    outline:0;
    border:0;
}

Upvotes: 3

Related Questions