0 Пользователей и 1 Гость просматривают эту тему.
  • 7 Ответов
  • 729 Просмотров
*

intedant

  • Захожу иногда
  • 96
  • 0 / 0
Попал мне в руки сайт. На сайте некий изверг вписал меню вот так
Код
<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;

}
но абсолютно ничего не происходит.
в чем ошибка?
*

umbabaraumba

  • Живу я здесь
  • 2415
  • 153 / 1
  • если помог можете поставить +
Допишите display: block;
Errare humanum est
Ubuntu по-русски
Пишу не сложные модули и компоненты, не дорого но не срочно
*

intedant

  • Захожу иногда
  • 96
  • 0 / 0
Допишите display: block;
не то у меня просто кнопки разлетелись по всему экрану
*

Ilhom666

  • Завсегдатай
  • 1385
  • 184 / 0
ссылку на сайт дайте
*

intedant

  • Захожу иногда
  • 96
  • 0 / 0
ссылку на сайт дайте
http://gruzovip.by/ нужно приподнять пункт меню который сейчас активен приподнять на 2-3 px
*

umbabaraumba

  • Живу я здесь
  • 2415
  • 153 / 1
  • если помог можете поставить +
http://gruzovip.by/ нужно приподнять пункт меню который сейчас активен приподнять на 2-3 px
.top_position a.active1 {
    position: relative;
    top: -2px;
}
Но придется для каждой ссылки отдельно прописывать, или через запятую сразу для всех .
Errare humanum est
Ubuntu по-русски
Пишу не сложные модули и компоненты, не дорого но не срочно
*

intedant

  • Захожу иногда
  • 96
  • 0 / 0
.top_position a.active1 {
    position: relative;
    top: -2px;
}

ну 2х пикселей оказалосьмало но помогло, спасибо + в карму)
Но придется для каждой ссылки отдельно прописывать, или через запятую сразу для всех .
*

Shustry

  • Moderator
  • 6436
  • 744 / 3
Вот так одним правилом для всех будет:

Код: css
.top_position a.[class^="active"] {
    position: relative;
    top: -2px;
}
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Выделить ссылку, которая ссылаеться на текущую страницу

Автор web1

Ответов: 4
Просмотров: 163
Последний ответ 15.02.2021, 13:24:50
от beliyadm
Как закруглить края выпадающего меню?

Автор coliandra

Ответов: 1
Просмотров: 261
Последний ответ 11.12.2020, 21:15:57
от effrit
При прокрутке страницы виджет залезает на меню

Автор coliandra

Ответов: 2
Просмотров: 243
Последний ответ 27.11.2020, 11:33:58
от coliandra
Как убрать маркер только из одного пункта меню.

Автор kuraev64

Ответов: 2
Просмотров: 574
Последний ответ 20.07.2020, 11:18:44
от kuraev64
Проблема с меню на сайте

Автор nesskafe

Ответов: 9
Просмотров: 454
Последний ответ 01.06.2020, 11:03:58
от sivers