Почему НЕ работает :hover (в любом браузере) (z-index)?

Question

[Алексей Смирнов]

Вопрос закрыт!

В footer части сайта не работает псевдокласс :hover.
Есть такая страница:
1) i4.ru/index2.html - на этой странице :hover работает так как надо (при наведении мыши фон меняется на зеленый).
А если взглянуть на эту страницу:
2) i4.ru/
и внизу нажать на белую стрелочку (чтобы footer раскрылся).
То в этом случае при наведении мышью фон уже НЕ меняется на зеленый.

Отличие этих страниц только в заданном z-index(индексе) (footer'a), в 1-м случае z-index: 2, а во 2-м z-index: 1.
Этот z-index прописан в OpenFooter.css -> footer { z-index: 1 }.

Что желательно изменить в коде чтобы содержимое < footer > стало работать нормально (как на странице 1) и при этом footer прятался бы под фон, как на странице 2 ?

P.S. За дизайн стыдно, он еще не продуман до конца.

Answer 1

[CeZZ]

У #OpenFooter убрать position: relative

Answer 2

[Константин Довнар]

Проблема в том, что у вас его перекрывает блок OpenFooter. Когда вы наводитесь вниз - вы наводитесь на него, а не на footer.

upd. Опоздал. :)
Как правильно сказал @CeZZ - убрать position: relative у OpenFooter.