Попал мне в руки сайт. На сайте некий изверг вписал меню вот так
<div class="top_position">
<?php switch ($_SERVER['REQUEST_URI']) {
case '/gruzoperevozki.html' : $back1='active1';
break;
case '/gruzchiki.html' : $back3='active3';
break;
case '/vyvoz-musora.html' : $back2='active2';
break;
case '/zemlyanye-podsobnye-raboty.html' : $back4='active4';
break;
case '/arenda-spetstekhniki.html' : $back5='active5';
break;
case '/blagoustrojstvo.html' : $back6='active6';
break;
}?>
<a class="top1 <?php echo $back1;?>" href="/gruzoperevozki.html"><img src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/images/menu1.png"></a>
<a class="top2 <?php echo $back3;?>" href="/gruzchiki.html"><img src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/images/menu2.png"></a>
<a class="top3 <?php echo $back2;?>" href="/vyvoz-musora.html"><img src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/images/menu3.png"></a>
<a class="top4 <?php echo $back4;?>" href="/zemlyanye-podsobnye-raboty.html"><img src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/images/menu4.png"></a>
<a class="top5 <?php echo $back5;?>" href="/arenda-spetstekhniki.html"><img src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/images/menu5.png"></a>
<a class="top6 <?php echo $back6;?>" href="/blagoustrojstvo.html"><img src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/images/menu6.png"></a>
<div class="clear"></div>
</div>
<div class="center_table">
и соответственно к этому всему есть стили
.top_position {
width: 99%;
height: 100%;
text-align: center;
margin-bottom: 20px;
}
.top_position a {
display:inline-block;
text-align:right;
width:18%;
margin-left: -2%;
padding-bottom: 5px;
text-decoration:none;
}
.top_position a img {
}
.top_position a:hover {
}
.top_position a.active1 {
}
.top_position a.active2 {
}
.top_position a.active3 {
}
.top_position a.active4 {
}
.top_position a.active5 {
}
.top_position a.active6 {
}
.top_position a img:hover {
opacity: 0.8;
}
И вроде бы даже оно все ровно и красиво стоит. Но нужно как то выделить активный пункт меню. Причем хотелось бы его просто приподнять немного на пару пикселей вверх.
Соответственно я пишу
.top_position a.active1 {
margin-top:2px;
}
но абсолютно ничего не происходит.
в чем ошибка?