VPF::не отображает list-style-image в FF при наведении

Enya

Дата 11.6.2007, 14:44 (ссылка)

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

Загрузка ...

Опытный

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

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

вот делаю меню. всё просто. есть список элементов меню. при наведении у списка отображается картинка list-style-image, если не наведена мышь то не отображается.
В IE работает - а в FF нет. А нужно сами понимаете что бы показывалось одинаково.

Код


<table class="left-menu" width="205" border="0" cellpadding="0" cellspacing="0">
         <tr>
             <td valign="top">
                         <div class="left-menu-content">
                          <div class="MenuLeft">
                             <ul class="MenuList">
                              <li class="MenuListPosition"><a href="#" class="MenuListItem">One</a></li>
                                <li class="MenuListPosition"><a href="#" class="MenuListItem">Two</a></li>
                                <li class="MenuListPosition"><a href="#" class="MenuListItem">Thee</a></li>
                                <li class="MenuListPosition"><a href="#" class="MenuListItem">Next button</a></li>
                                <li class="MenuListPosition"><a href="#" class="MenuListItem">Next button</a></li>
                                <li class="MenuListPosition"><a href="#" class="MenuListItem">Next button</a></li>
                                <li class="MenuListPosition"><a href="#" class="MenuListItem">Next button</a></li>
                                <li class="MenuListPosition"><a href="#" class="MenuListItem">Next button</a></li>
                                <li class="MenuListPosition"><a href="#" class="MenuListItem">Next button</a></li>
                                <li class="MenuListPosition"><a href="#" class="MenuListItem">Next button</a></li>
                                <li class="MenuListPosition"><a href="#" class="MenuListItem">Next button</a></li>
                                <li class="MenuListPosition"><a href="#" class="MenuListItem">Next button</a></li>
                                <li class="MenuListPosition"><a href="#" class="MenuListItem">Next button</a></li>
                                <li class="MenuListPosition"><a href="#" class="MenuListItem">Next button</a></li>
                                <li class="MenuListPosition"><a href="#" class="MenuListItem">Next button</a></li>
                                <li class="MenuListPosition"><a href="#" class="MenuListItem">Next button</a></li>
                                <li class="MenuListPosition"><a href="#" class="MenuListItem">Next button</a></li>
                                <li class="MenuListPosition"><a href="#" class="MenuListItem">. . .</a></li>
                             </ul>
                            </div>
                         </div>
             </td>
         </tr>
        </table>

Код


table.left-menu{
    background-image: url(images/background-left-menu.jpg);
    background-position: top;
    background-repeat: no-repeat;
    width: 205px;
    padding: 0px;
    margin: 0px;
    /*height: 324px;*/
}
div.left-menu-content{
   /*border: 1px Solid red;*/
   background-color: #e1eafb;
    width: 190px;
    margin-top: 8px;
    margin-left: 7px;
    margin-right: 4px;
    margin-bottom: 0px; 
    /*height: 315px;*/
}
div.MenuLeft{
    border: 1px Solid red;
    margin: 0px;
    padding: 0px;
}
ul.MenuList{
    border: 1px Solid red;
    list-style-type: none;
    /*padding: 0px;
    margin: 4px 4px 4px 10px;*/
}
li.MenuListPosition{
 display: list-item;    
}
li.MenuListPosition a.MenuListItem:link, a.MenuListItem:active, a.MenuListItem:visited{
 list-style-type: none;
 font-family: Arial, Helvetica, sans-serif;
 font-size: 12px;
}
li.MenuListPosition a.MenuListItem:hover{
 list-style-image: url(images/li_red.jpg);
 list-style-position: inherit;
 font-family: Arial, Helvetica, sans-serif;
 font-size: 12px;
}

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

Утсанвлен Денвер
1. PHP Version 5.1.6
2. MySQL 5.0.18-max
3. phpMyAdmin 2.6.1

Mymik

Дата 11.6.2007, 18:04 (ссылка)

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

Загрузка ...

Эксперт

Профиль
Группа: Участник Клуба
Сообщений: 1474
Регистрация: 12.5.2006
Где: Lamer-центер

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

Enya, а с какого перепугу оно работает в IE ??? O_o
Оно вообще-то и там не должно работать. Потому как в 39 строчке написано, что ты переопределяешь класс MenuListItem. А этот класс относится для тэга "a"...
чес слово это странно... я не знал что у тэга "a" есть list-style-image...

Ну это. Переопредели еще для MenuListPosition:hover и тогда будет работать.
hover в IE работает только для ссылок. А во всех остальных для любого элемента. Так что если ты переопределишь hover для MenuListPosition, то это не повлияет на браузер IE.

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

ICQ ::            857-857
E-mail ::         mymik[at]inbox[dot]ru
HomaPage ::  http://localhost/

:to_become_senile  :this

SelenIT

Дата 11.6.2007, 19:40 (ссылка)

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

Загрузка ...

баг форума

Профиль
Группа: Завсегдатай
Сообщений: 3996
Регистрация: 17.10.2006
Где: Pale Blue Dot

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

Цитата(Enya @ 11.6.2007, 14:44

)

li.MenuListPosition a.MenuListItem:link, a.MenuListItem:active, a.MenuListItem:visited{

Enya, опять Вы задаете стиль обычной ссылки только для ссылок в нужных блоках, а стиль активной и посещенной - для любых... вроде ж совсем недавно наступали на эти грабли? ;)

Цитата(Mymik @ 11.6.2007, 18:04

)

я не знал что у тэга "a" есть list-style-image...

По идее (и по стандарту) оно есть у всего, для чего задано display:list-item - независимо от тега. Но для ссылок лично я предпочитаю "играть" с фоном, а не с рисунком маркера - его и менять проще, и точно позиционировать легче...

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

Осторожно! Данный юзер и его посты содержат ДГМО! Противопоказано лицам с предрасположенностью к зонеризму!

Enya

Дата 11.6.2007, 20:17 (ссылка)

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

Загрузка ...

Опытный

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

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

SelenIT, почему? Я же указала что для тех у кого класс MenuListItem, а не для всех?!

Добавлено через 26 секунд
и да, я тоже наверное лучше поиграюсь с фоном.

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

Утсанвлен Денвер
1. PHP Version 5.1.6
2. MySQL 5.0.18-max
3. phpMyAdmin 2.6.1

Mymik

Дата 12.6.2007, 09:51 (ссылка)

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

Загрузка ...

Эксперт

Профиль
Группа: Участник Клуба
Сообщений: 1474
Регистрация: 12.5.2006
Где: Lamer-центер

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

Цитата(SelenIT @ 11.6.2007, 19:40

)

Но для ссылок лично я предпочитаю "играть" с фоном, а не с рисунком маркера - его и менять проще, и точно позиционировать легче...

+1
Тем более он позиционируется в разных браузерах по разному...

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

ICQ ::            857-857
E-mail ::         mymik[at]inbox[dot]ru
HomaPage ::  http://localhost/

:to_become_senile  :this

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