Проблема с меню

[Mary_RND]

Меню сделано на основе картинок, все браузеры кроме IE6 реагирует нормально на вариант вертикального меню этим способом

При наведение на меню оно начинает убегать вверх из-за

#second .s-menu a:hover {

background-position: right 0 !important;

}

без него все нормально, но не работает как надо

css

#second .s-menu {
 background:#9f1e26;
 padding:30px 0 20px 30px;
}
#second .s-menu a {
 display:block; 
 margin:0 0 18px 0;
}
#second .s-menu a#s_7 {
 background:url(/i/s_m_rest.gif) no-repeat;
 width:116px;
 margin-bottom:18px;
 height: 11px;
}
#second .s-menu a#s_804 {
 width:31px;
 margin:0 0 10px 0; 
 background:url(/i/s_van.gif) no-repeat;
 height: 9px;
}
#second .s-menu a#s_807 {
 width:67px;
 margin:0 0 10px 0;
 background:url(/i/s_eurasia.gif) no-repeat;
 height: 9px;
}
#second .s-menu a#s_813 {
 width:72px;
 margin:0 0 10px 0;
 background:url(/i/s_stanica.gif) no-repeat;
 height: 11px;
}
#second .s-menu a#s_815 {
 width:56px;
 margin:0 0 10px 0;
 background:url(/i/s_fregat.gif) no-repeat;
 height: 10px;
}
#second .s-menu a#s_816 {
 width:73px;
 margin:0 0 10px 0;
 background:url(/i/s_samurai.gif) no-repeat;
 height: 11px;
}
#second .s-menu a#s_8 {
 width:50px;
 background:url(/i/s_m_cafe2.gif) no-repeat;
 height: 13px;
}
#second .s-menu a#s_mini {
 width:120px;
 background:url(/i/s_m_mini.gif) no-repeat;
}
#second .s-menu a#s_orange {
 width:80px;
 margin:0 0 10px 0;
 background:url(/i/s_m_orange.gif) no-repeat;
 height: 11px;
}
#second .s-menu a#s_moktely {
 margin:0 0 10px 0;
 width:72px;
 background:url(/i/s_m_moktely.gif) no-repeat;
}
#second .s-menu a#s_pancakes {
 margin:0 0 10px 0;
 width:144px;
 background:url(/i/s_m_pancakes.gif) no-repeat;
 height: 11px;
}
#second .s-menu a#s_rotonda {
 margin:0 0 10px 0;
 $padding:0 0 10px 0;
 width:177px;
 background:url(/i/s_m_rotonda.gif) no-repeat;
 height: 11px;
}
#second .s-menu a:hover {
background-position: right 0 !important;
}

#second .s-menu img {
 border: 0 solid;
}
#second .s-menu img.minicafe {
 margin: 0 0 10px 0;
}
#second .s-menu img.minicafe_last {
 margin: 0 0 10px 0;
}
#second .s-menu img.mini_cafe_active {
 border: 0 solid;
 margin-left:-12px;
 margin-bottom:10px;
}

#second h1 {
 background:#a5232b;
 text-align:center;
 width:207px;
 padding:10px 0 8px 0;
}
#second .text {
 padding:30px 25px 35px 25px;
 color:#666;
}
#second .text .news div.date {
 color:#ccc;
 font-size:0.85em;
 width:57px;
 clear:left;
}
#second .text .news a, #second .text .news a:hover {
 color:#a5232b;
 font-size:1.15em;
}

html

<div class="left">
 <div><img src="/i/s_foto1.jpg" alt=""></div>

 <div class="s-menu">
 <a href="/catalog/i/1786" id="s_7"><img src="/i/sp.gif" alt="Рестораны"></a> 
 <a href="/catalog/i/1786" id="s_804"><img src="/i/sp.gif" alt="Ван"></a>
 <a href="/catalog/i/1794" id="s_807"><img src="/i/sp.gif" alt="Евразия"></a>
 <a href="/catalog/i/1796" id="s_813"><img src="/i/sp.gif" alt="Станица"></a>
 <a href="/catalog/i/1798" id="s_8"><img src="/i/sp.gif" alt="Кафе"></a> 
 <a href="/catalog/i/1798" id="s_815"><img src="/i/sp.gif" alt="Фрегат"></a>
 <a href="/catalog/i/1800" id="s_816"><img src="/i/sp.gif" alt="Самурай"></a>
 <a href="/orange" id="s_orange"><img src="/i/sp.gif" alt="Апельсин"></a>
 <a href="/pancakes" id="s_pancakes"><img src="/i/sp.gif" alt="Блинная "Бочка""></a>
 <a href="/rotonda" id="s_rotonda"><img src="/i/sp.gif" alt="Сеть кафе "Ротонда""></a>
 </div> 
</div>

[Mary_RND]

Никто не может помочь с проблемой?(

[3ABAPKA]

Может тебе дать код чтоб сама не мучалась? Построишь его как тебе надо!

[Mary_RND]

Какой код? Такого способа реализации меню? Без глюка такого?

[Mary_RND]

Проблема исправлена методом добавления абсолютного позиционирования

[apika]

Mary_RND, а вы проверяли свое меню в широкодиагональном мониторе. Это абсолютное позиционирование , что б его...в общем

[Shuranka]

Mary_RND, а вы проверяли свое меню в широкодиагональном мониторе. Это абсолютное позиционирование , что б его...в общем

Извините за оффтоп, но ИМХО широкоформатники (хоть мониторы, хоть телевизоры) в нашей стране использовать не следует формат не тот. Попробуйте запихнуть формат 4:3 в формат 16:9, ничего хорошего из этого не получится. Скажем, попробуйте установить на широкоформатнике картинку размером 1024х768 на Рабочий стол, пропорции теряются заметно.

Теперь по position:absolute. Вс? зависит от указанных параметров top, left, а также от ширины объекта (фиксированная или резиновая).

[Mary_RND]

К сожелению на широформатном проверить не могу-__-"

попробую поэксперементировать с top и left

просто верстка не моя сайта, а вот править приходиться мне(

[Mary_RND]

Хм

Проверила на широкоформатном, все нормально во всех браузерах

что именно не так?