Проблемы с меню

Здравствуйте. У меня сложилась проблема которую уже в течении нескольких дней не могу решить.
Есть сайт, Есть главное горизонтальное меню. Как сделать чтоб при нажатии кнопки в меню — эта кнопка оставалась активной???
Допустим в покое у кнопки один рисунок, при наведении на нее она меняет его (a:hover), а после нажатия у нее 3-й рисунок. Кнопку реализовал, а вот как сделать чтоб WordPress понимал что эта кнопка нажата — не знаю.

Код меню

<div id="menu">
<div class="icon1"><a href="http://reg.ru/sait"><span>эконом</span></a></div>
<div class="icon2"><a href="http://reg.ru/sait/vizitka"><span>Визитка</span></a></div>
<div class="icon3"><a href="http://reg.ru/blog"><span>Блог</span></a></div>
</div>

Код CSS для кнопок

.icon1 a {
background-image: url(images/button6.gif);
margin: 12px 0px 0px 14px;}

.icon2 a {
background-image: url(images/button6.gif);
margin: 37px 0px 0px 14px;}

.icon3 a {
background-image: url(images/button6.gif);
margin: 12px 0px 0px 16px;}

.icon1 a, .icon2 a, .icon3 a, .icon4 a, .icon5 a, .icon6 a, .icon7 a{
width:111px;
height:100px;
position: relative;
float: left;
background-position: 0px -200px;
border: none;
background-repeat: no-repeat;}

.icon1 a span, .icon2 a span, .icon3 a span{display: none;}
.icon1 a:hover, .icon2 a:hover, .icon3 a:hover{position: relative;background-position: 0px -100px;}
.icon1 a:active, .icon2 a:active, .icon3 a:active{position: relative;background-position: 0px 0px;}