VPF::Подсветка выделенной ссылки - Форум программистов

stat007

Дата 23.5.2012, 17:48 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 521
Регистрация: 9.10.2008

Репутация: нет
Всего: -4

Подскажите плиз как прописать правильно в стиле, что бы при наведении на ссылку в меню, background становился синего цвета, но нужно что бы было это шире чем сама ссылка.

Код


<div class="content_main">
        <ul class="menu_verh">
            <li><a href="#">Школа</a></li>
            <li><a href="#">Учителя</a></li>
            <li><a href="#">Предметы</a></li>
            <li><a href="#">Конкурсы</a></li>
            <li><a href="#">Вакансии</a></li>
            <li><a href="#">Проекты</a></li>
        </ul>
            </div>

Код


.menu_verh li a:hover
        {
            font: 14px "Century Gothic";
            color: #fff;
            text-decoration:none;
            background: #2490b7;
        }

У меня получается только сам задний фон ссылки срабатывает, а как его расширить???
Прилаживаю картинку чего я хочу добиться.

Присоединённый файл ( Кол-во скачиваний: 9 )

11.JPG 11,63 Kb

bars80080

Дата 23.5.2012, 19:58 (ссылка)

(голосов:1)

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 50
Всего: 315

Код


.menu_verh li:hover
        {
            background: #2490b7;
        }

stat007

Дата 24.5.2012, 20:40 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 521
Регистрация: 9.10.2008

Репутация: нет
Всего: -4

bars80080, Ну опять таки, тоже самое.. не широкое.. не так как на скрине..(

как получается привожу в скрине

Присоединённый файл ( Кол-во скачиваний: 6 )

112.JPG 5,60 Kb

bars80080

Дата 24.5.2012, 21:57 (ссылка)

(нет голосов)

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 50
Всего: 315

тогда самой ссылке надобно задать все параметры "ширины"

к примеру:

Код


.menu_verh li a
        {
            font: 14px "Century Gothic";
            color: #fff;
            text-decoration:none;
            display: inline-block;
            padding: 8px 10px;
            vertical-align: bottom;
        }

Aliance

Дата 25.5.2012, 09:25 (ссылка)

(нет голосов)

Загрузка ...

I ♥ <script>

Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

Репутация: 2
Всего: 137

Скиньте уже разметку на jsfiddle.net чтобы мы не гадали по вашим скриншотам.

--------------------

• Все о событиях
• Объекты и массивы
• ОКНА И ФРЕЙМЫ

JAVA ≠ JavaScript

tarsukoff

Дата 28.6.2012, 21:04 (ссылка)

(нет голосов)

Загрузка ...

CEO Onecontent

Профиль
Группа: Участник
Сообщений: 14
Регистрация: 5.2.2012
Где: Samara

Репутация: нет
Всего: нет

Зачем ссылки.. Тут и так понятно что размеры не заданы. Поставь ширину больше ширины текста.

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| Вёрстка веб-сайтов \| Следующая тема »