css focus not working in safari and chrome -

i got 1 strange problem never got before. please see code:

the css:

#btn{     margin-left:150px;     padding:10px;     display:block; } #btn a{     padding:5px 20px;     background:green;     color:#fff;     text-decoration:none;     outline:none; } #btn a:hover{     background:#933;     } #btn a:focus, #btn a:active{     background:#cf0; color:#000;  

}

here html

<div id="btn">    <a href="#">click here</a> </div> 

the focus , active css working in firefox, not in chrome , safari.

yeah seems little problem focus in webkit. not bug. fixable in html. use tabindex.

     <a href="#" class="hide" tabindex="1">[hide]</a>      <a href="#" class="show" tabindex="2">[show]</a> 

ta da ...