CSS active is not working for selecting the tabs

Question

Once we select the any tabs like account,bills,data,usage.Hovering working perfect. But selected backgroundcolor is not active state, Here is my css

.header :active, .footer:active {
    border: none;
    background:yellow;
    box-shadow: 0px 0px 1px #777;
}

JSFiddle

Answer 1

Live demo

you should remove the space between header and :active

.header:active, .footer:active {
    border: none;
    background:yellow;
    box-shadow: 0px 0px 1px #777;
}