CSS 按钮 :active not working

Question

也许这只是我忽略的一个愚蠢的问题。

Fiddle

表格上方的按钮和删除按钮都遵循 :active 子句中的 box-shadow，但第 5 个单元格的按钮不遵循。

我使用的是 Chrome 23。

Answer 1

您希望您的按钮位于第 5 个 td 中吗？如果是，则删除此内容

Demo

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

或者，如果您希望您的按钮就在那里(表外)，请将 #table button 替换为以下样式

Demo 2

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

还要加上这个

#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