CODEWITHSUNDEEP
css
TwiN
TwiN

Reputation: 1912

CSS button:active not working

Maybe it's just a silly problem that I have overlooked.

Fiddle

The button above the table and the delete button both obeyed the box-shadow in the :active clause but the one the the 5th cell doesn't.

I am using Chrome 23.

Upvotes: 2

Views: 7799

Answers (1)

Mr. Alien
Mr. Alien

Reputation: 157334

Do you want your button to be in the 5th td? If yes than remove this

Demo

#table button{    
    position: absolute;
    top: 0px;
    right: 5px;
    height: 10px;
    width: 1.5em
}

Or if you want your button to be right there(Outside Table), replace #table button with the below styles

Demo 2

#table button{    
    position: absolute;
    top: 0px;
    right: 5px;
}

And also add this

#table button:active{    
    position: absolute;
    top: 0px;
    right: 5px;
    top: 1px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, .3) inset;
    background-image: none
}

Note: You are using position: absolute;, be sure you've wrapped it inside a position: relative; container

Upvotes: 2

Related Questions