Internet Explorer 7 CSS Позиционирование меню - PullRequest
Новая
       21

Internet Explorer 7 CSS Позиционирование меню

0 голосов
/ 17 сентября 2011

Я создал меню на HTML и CSS, которое работает во всех основных браузерах (Chrome, Firefox, IE8 + и Safari). Вы можете найти его здесь: http://www.calvaryccm.com/MenuTest.aspx

Проблема возникает в IE 7.

У меня есть меню при наведении курсора, использующее JS для эффекта. Когда я пытаюсь сделать это в IE7, вот что происходит:

IE 7 Menu Error

Мне нужна помощь, чтобы понять, как расположить меню под текстом. Спасибо за вашу помощь!

Ответы [ 2 ]

2 голосов
/ 17 сентября 2011

Я не уверен, хотите ли вы использовать .block или .nav в селекторах ниже. Я пошел с .block, потому что я вижу его применение к элементу.

  • Вкл. .block ul, удалить overflow: hidden.
  • Вкл. .block li, добавить position: relative.
  • Вкл. .block ul.nav ul, добавить left: 0.

Теперь у вас есть печально известная проблема IE6 / 7 z-index :

  • Чтобы исправить это в этом случае, на .block ul добавьте position: relative; z-index: 3.
  • z-index: 3 на единицу выше z-index на #player-area.
1 голос
/ 17 сентября 2011

Кроме того, вам не нужно использовать javascript для добавления класса hover, как вы уже сделали. Просто используйте псевдо-селектор :hover в CSS: 

ul.nav > li:hover
...