frD-Изменение блока меню при наведении на ссылку

[okunev2]

Как реализовать на css, такое:

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

[SkyLight]

указать ссылке display: block

[okunev2]

так и сделал, но теперь в Опере и Мозиле, заливка шире, а ИЕ нормально

как фиксировать этот блок?

[Emm]

покаж код.

[okunev2]

div.menu2 {
 width: 100%;
 height: 100%;
 font-family: Verdana;
 font-size: 11px;
 color: #333333;
 TEXT-DECORATION: underline
 text-align: left;
 padding-left: 35px;
}

div.menu2 a {
 display: block;
 width: 210px;
 height: 100%;
 color: #3366CC;
 text-align: left;
}

div.menu2 a:hover {
 background-color: silver;
 text-decoration: none;
 color: #ffffff;
}

div.menu2 a:visited {
 background-color: none;
 text-decoration: none;
 color: #774F1E;
}

[Цветков Антон]

1) После "TEXT-DECORATION: underline" нет точки с запятой;

2) "height: 100%;" - бесполезен, если вы правильно указали DOCTYPE; если DOCTYPE указан неверно, то ошибка именно в нем (разница в браузерах отображения "по умолчанию");

3) "display: block;" и "width: 210px;" - практически бессмысленно, т.к. block отчасти на то и предназначен, чтобы растягивать элемент по всей ширине;

4) Покажите вашу страничку, чтобы видеть баг.

[okunev2]

все это, понятно!

вот как это исправить:

[Цветков Антон]

см. п. 4...

[okunev2]

вот я же кусок показал, видите слева нет блока от текста!

вот код того места на странице:

<tr><td height="25" background="{THEME}/images/2_bg_menu.gif"><div class="menu2"><a href="#">Главная</a></div></td></tr>

вот css:

div.menu2 {
 height: 100%;
 font-family: Verdana;
 font-size: 11px;
 color: #333333;
 TEXT-DECORATION: underline;
 text-align: left;
 padding-left: 35px;
 line-height:22px;
}

div.menu2 a {
 display: block;
 height: 100%;
 color: #3366CC;
 text-align: left;
}

div.menu2 a:hover {
 background-color: silver;
 text-decoration: none;
 color: #ffffff;
}

div.menu2 a:visited {
 background-color: none;
 text-decoration: none;
 color: #774F1E;
}

[Цветков Антон]

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

PS: Я даже вижу возможный способ упростить вашу конструкцию меню (судя по показанному пункту), значительно его оптимизировав и убрав половину тегов... Так что для вашей же пользы - не поленитесь выложить весь документ на каком-нибудь сервере (раз занимаетесь html - давно пора завести) или здесь на крайний случай.

[okunev2]

Не все, правильно, только загвоздака, вто что стиль div.menu2 применяшей к словам в ячейке таблицы и когда делаешь отступ: padding-left: 35px; и так line-height:22px; то слева от текста само собой блок не приминяется, как мне проще текст выравнить шоб его блок полность всю ячейку затянул?

[Цветков Антон]

"padding-left: 35px" убрать, для "div.menu2 a" сделать "text-indent: 35px". Если пробема только в этом, тогда ладно... Я уж подумал, что баг еще в том заключается, что картинки нет (как у "Новости сайта" ниже)...

[okunev2]

сделал отдельный класс для a href и усе

[kiD]

перенести вопрос

проблемы с версткой

тема закрыта