Css rollover navigation bar in Firefox

1

I have this CSS code below and the active link (#navbar a:active in my css) works in IE but not in Firefox. In other words, when I click on the button, another button is loaded and stayed as it is supposed to. In Firefox, it did not stay. Thanks

My html:
…
<link href=“style.css” rel=“stylesheet” type=“text/css”>
</head>

<body>
<ul id=“navbar”>
<li><a href="#">Home</a></li>
<li><a href="#">Menu Item 2</a></li>
<li><a href="#">Menu Item 3</a></li>
<li><a href="#">Menu Item 4</a></li>
</ul>
</body>

My css:
#navbar {
font-family:Arial, Helvetica, sans-serif;
font-size:.8em;
font-weight:bold;
height:45px;
}
#navbar li {
list-style:none;
display:inline;
}
#navbar a {
width:110px;
color:#fff;
text-decoration:none;
background:url(“images/button-up.jpg”) no-repeat;
float:left;
padding:12px 10px 13px;
margin:0 -10px;
}
#navbar a:hover {
background-position:0 -45px;
color:#1e5ebd;
background:url(“images/button-down.jpg”) no-repeat;
}
// THIS DOES NOT WORK SOMEHOW WITH FIREFOX!!!
#navbar a:active {
background-position:0 -90px;
color:#FEF8AF;
background:url(“images/button-down.jpg”) no-repeat;

}