Css property a:focus not working

See more:

CSS

Hello,

I'm using Css a:focus and it does not work. This is the code :

Css:

 #nav {
    
font-family:  "Lucida Grande","Lucida Sans Unicode",Arial,Verdana,sans-serif;
float:left;
position:absolute;
left:0px;
top:140px;
width:100%;
margin:5px;
padding:5px;
background-color:#DDDDDD;
}

#nav li {
display:inline;
padding:0;
margin:0;
}

#nav a:link,
#nav a:visited {
color:#555454;
width: 75px;
height: 22px;
float:left;
background:url('12.png') no-repeat;
padding:5px 0px 0px 30px;
}

#nav a:hover{
background:url('11.png') no-repeat;
border:2px solid red;
}

#nav a:active {color: orange;}​

#nav a:focus {color: red;}​

<ul id="nav">
<li><a href="/" tabindex="1">home</a></li>
<li><a href="http://google.com">explore</a></li>
</ul>

The problem is that a:focus is not working at all. When I'm on the homepage, the first link has no focus properties specified in CSS.

Any ideas?