Style button when :active different from :hover

Question

I want to make a button that displays a background color when hovering and a button color without a background color when the button is down. Here is my current code:

Answer 1

How about this?

I would guess, its cause on the first property you are using background-color and the second fill.

button:hover {
    background-color: red;
}
button:active {
    background-color: blue;
}

jsFiddle working example (1)