IE6: не убирается элемент при отведении курсора в hover

[Maha]

Возникла проблема: для ссылок меню дизайнер предусмотрел красивую подсветку снизу при наведении. Возникла проблема в "горячо любимом браузере": после отведения курсора с пункта меню не убирается эта самая подсветка.

Код меню:

<ul class="menu zoom">
		<li><a href="#" class="current" title="Главная">Главная<span class="left"></span><span class="right"></span></a></li>
		<li><a href="#" title="О предприятии">О предприятии<span class="left"></span><span class="right"></span></a></li>
		<li><a href="#" title="Услуги">Услуги<span class="left"></span><span class="right"></span></a></li>
		<li><a href="#" title="Цены">Цены<span class="left"></span><span class="right"></span></a></li>
		<li><a href="#" title="Контакты">Контакты<span class="left"></span><span class="right"></span></a></li>
</ul>

Стили для меню такие:

ul.menu {
		margin:0;
		margin-right:35px;
		padding:0;
		list-style:none;
		position:absolute;
		bottom:0;
		right:0;
		}
	.menu li {	
		margin:0 24px;
		display:inline;
		font-style:italic;
		font-size:2em;
		letter-spacing:-1px;
		}
	.menu a {
		color:#ffd393;
		position:relative;
		}
	.menu a:hover {

		}
	.menu a span {
		height: 8px;
		width:60px;
		position:absolute;
		bottom:-8px;
		}

	.menu a span.left {
		right:50%;	
		}
	.menu a span.right {
		left:50%;	
		}
	.menu a:hover span.left{
		background:url(hover1.gif) no-repeat left  bottom;
		}
	.menu a:hover span.right{
		background:url(hover2.gif) no-repeat  right bottom;
		}
	.menu a.current {
		color:#fff;
		}
	.menu a.current:hover {	
		text-decoration:none;
		}

Edited September 29, 2010 by Maha

[klierik]

поместите код в соответствующе теги

[npofopr]

zoom:1; скорее всего поможет

[Maha]

zoom:1; скорее всего поможет

zoom пробовала - не помогает

так подшаманить не удалось

[rash]

Есть смутное подозрение, что если в правило с :hover добавить letter-spacing: 0; то это может помочь. А может и не помочь.

[SelenIT]

Часто в подобных случаях помогает что-то, связанное с фоном или шрифтом для самой a:hover.

[Maha]

Часто в подобных случаях помогает что-то, связанное с фоном или шрифтом для самой a:hover.

Большое спасибо! В ие6 я сама переделала, а вот Опера 9.5 и 9.6 глючила. Ваша ссылка помогла решить проблему

[psywalker]

А что ты сделала, для того, чтобы решить трабл в ИЕ6?

[Maha]

А что ты сделала, для того, чтобы решить трабл в ИЕ6?

в общем я решила забить на появление фона только при hover. Я изначально поставила спану фон и свойство opacity:0, чтобы не было видно. Соответственно, при hover - opacity:1. Заработало во всех браузерах, кроме любимого. Для IE6 - фильтры на прозрачность filter: alpha(Opacity=0); (я использовала этот, но есть еще получше. но не стала заморачиваться). Все стало как надо. В Опере 9.5 и 9.6 при наведении спана не было видно. Задала ему display:block и все стало хорошо...

[psywalker]

Понял, спс.