Нужно сверстать такое меню:
Неактивные пункты окрашены в серый цвет с использованием градиента, активная владка имеет цвет основого блока с информацией- белый, а пункт, на который наведен курсор, становится выше остальных, как на картинке
Не получается выровнять текст в пунках меню по вертикали, vertical-align
не работает.
Цвет выбранного пункта у меня не меняется на белый, нужен не пседокласс active
, а что-то другое, но я не знаю что.
При наведении курсора высота пункта меню увеличивается вниз, а не вверх.
Пока что получается только так
Вот код, только там без картинок
http://jsfiddle.net/tUrHA/
Подскажите, как хотя бы приблизиться к тому, что я хочу получить?
-
Deonis, Большое спасибо!– Heidel23 мая 2012 в 17:28
-
Да не за что ...– Deonis23 мая 2012 в 17:47
Добавить комментарий
|
2 ответа
Уж пардон за откровенность, но это свалка, а не CSS. Как-то бы упорядочили, что ли... Оптимизировать за вас не стал, сделаете сами. Смотрим пример для ваших закладок
-
То, что надо с изменением высоты пункта меню, спасибо за помощь! Но цвет активной владки на белый в вашем коде не меняется :( Не подскажите, что нужно в него добавить, чтобы это тоже было?– Heidel23 мая 2012 в 16:56
-
Вы используете Ajax? Или при клике страница перегружается? И по ходу пьесы, псевдокласс :active - это когда на ссылку нажимаешь, но это не значит, что она остается активной до тех пор, пока не нажмешь на другую.– Deonis23 мая 2012 в 16:57
-
Я пока еще не знаю Ajax, нужного эффекта средствами html и css можно добиться?– Heidel23 мая 2012 в 17:00
-
-
1В этом случае выход такой - на каждой странице в соответствущий ей элемент <li>, добавить класс (напр., active_link), в котором задать белый цвет. Добавлять надо так: <li class="about active_link">– Deonis23 мая 2012 в 17:08