CODEWITHSUNDEEP
htmlcss
Goran Stošić
Goran Stošić

Reputation: 95

making <button> respond to :active, is it even possible

So far it only responds to hover, no clue why it doesn't respond to active

Here is the fidddle http://jsfiddle.net/tP9E9/1/.

CSS:

.menu ul li button:hover {
    background-color: rgba(206,0,0,1);
}

.menu ul li button:active {
    background-color: rgba(206,0,0,1);
}

As you can probably guess, I have couple of divs with various content that open in response to button clicks. Hover works fine, but when div corresponding to button is opened (active) the button doesn't go red. Why is that?

Thanks

Upvotes: 0

Views: 63

Answers (1)

Jason Vasilev
Jason Vasilev

Reputation: 310

Use 

<input type="button" value="news">

and css

input:hover {
    background-color: green;
}
input:active {
    background-color: yellow;
}

You can also add :focus which will be available on Tab.

JsFiddle

Upvotes: 3

Related Questions