Roman Shkarin
Roman Shkarin

Reputation: 177

Prevent hover over active state

How to prevent hovering button,div,li if it already has active status by means of css?

#list-of-tests .item-test:hover {
    background-color: #4d5f75;
    border: solid 1px #4d5f75;
}

#list-of-tests .item-test:active {
    background-color: #93c3cd;
    border: solid 1px #93c3cd;
}

Upvotes: 0

Views: 787

Answers (1)

Evan Mulawski
Evan Mulawski

Reputation: 55334

Two ways:

1) Use !important for the :active state:

#list-of-tests .item-test:active {
    background-color: #93c3cd !important;
    border: solid 1px #93c3cd !important;
}

2) Specify multiple states:

#list-of-tests .item-test:active,
#list-of-tests .item-test:active:hover {
    background-color: #93c3cd;
    border: solid 1px #93c3cd;
}

Upvotes: 3

Related Questions