css动画按钮上的活动或当前“状态”

Question

我无法在我的css-transitions按钮上激活或当前“状态”工作。 我尝试使用li a:active，但无法让它工作..

http://planeta.se/bullerWebb/butiken/

CSS

    #butikMenu {
        width: 100%;
        float: left;
        margin: 0 0 3em 0;
        padding: 0;
        list-style: none; }
    #butikMenu li {
        float: left; }
    #butikMenu{
        width: 100%;
        float: left;
        margin: 0 0 3em 0;
        padding: 0;
        list-style: none;
        /*border-bottom: 1px solid #ccc;*/ }
    #butikMenu li a {
            background:url(images/arrowTest2.png) no-repeat;
            background-position:-300px 0;
            transition: background-position 0.4s ease-in-out 0s;
            display: block;
            padding: 5px 11px;
            text-decoration: none;
            text-transform:uppercase;
            font-size:22px;
            color: #000;
             }
    #butikMenu li a:hover {
            background-position:top right;

            }
    #butikMenu li a:active  {
            background-position:top right;

            }