ошибки в меню сайта (php + css)

[Luara]

Добрый день.

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

Вот меню:

<nav class="menu">
	<div class="wrap">
		<ul>
			<li class="home-linck"><a class="active" href="<?php echo link_to_homepage() ?>"><?php echo __('Главная')?></a></li>
			<?php include_partial('global/menu', array('tpl' => 'index')); ?>
			<li class="li-contact"><a onclick="return false"><?php echo __('Контакты')?></a>
				<div class="contact">
					<span><?php echo __('По вопросам партнерства обращайтесь:')?></span>
					<div>
						<?php echo __('Позвонить:')?> +38 ....<br />
						<?php echo __('Написать:')?> ...					</div>
				</div>
			</li>
		</ul>
		<a href="https://www.facebook.com/AdEaters.UA" class="lable-fb"><img src="/design/img/block-fb.png" alt=""></a>
	</div>
</nav>

Вот css:
.menu {
 
  background-image: linear-gradient(top, #333333 50%, #1a1a1a 50%);
  background-image: -o-linear-gradient(top, #333333 50%, #1a1a1a 50%);
  background-image: -moz-linear-gradient(top, #333333 50%, #1a1a1a 50%);
  background-image: -webkit-linear-gradient(top, #333333 50%, #1a1a1a 50%);
  background-image: -ms-linear-gradient(top, #333333 50%, #1a1a1a 50%);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.5, #333333), color-stop(0.5, #1a1a1a));
}
.menu:before,
.menu:after {
  content: " ";
  /* 1 */

  display: table;
  /* 2 */

}
.menu:after {
  clear: both;
}
.menu .wrap {
  position: relative;
}
.menu ul {
  margin: 0;
  padding: 0;
}
.menu ul ul {
  position: absolute;
  background-color: #333333;
  margin-left: -32px;
  display: none;
}
.menu ul ul li {
  padding: 0 20px;
}
.menu li {
  list-style: none;
  float: left;
  padding: 0 32px;
}

.menu li.active {
  background-color: #08A03B;
}

.menu li:hover > ul  {
  display: block;
}
.menu li:hover > a {
  border-bottom: 2px solid #08A03B;
  padding-bottom: 7px;
}

.menu a {
  color: #fff;
  display: block;
  text-transform: uppercase;
  text-decoration: none;
  padding: 10px 0;
}
.menu .li-contact:hover .contact {
  display: block;
}
.menu .contact {
  position: absolute;
  background-color: #333333;
  padding: 25px 35px;
  margin-left: -35px;
  color: #fff;
  z-index: 1;
  display: none;
}
.menu .contact span {
  text-transform: uppercase;
}

Очень надеюсь на помощь))

Спасибо.

[Serge_Bliznykov]

я перенёс тему и почистил сообщения, не относящиеся к решению проблемы

[Andkorol]

Промахнулись разделом – PHP здесь никаким боком не при делах.
Скорее «HTML и CSS» или «Javascript».
Код практически бесполезен – нет части кода, которая генерируется при помощи PHP, потому сам код нельзя запустить в браузере, чтоб проверить работоспособность и выполнить отладку.
Возможно, проблема в этом CSS-правиле:

.menu li:hover > ul  {
  display: block;
}

Но это так, наугад.

[Luara]

Уф-ф-ф... спасибо.
Раздел уже меняли...

[Luara]

Вопрос снят)) Я думаю, эту тему можно удалить за ненадобностью.

[Stanislav]

Сообщение от Luara

Вопрос снят)) Я думаю, эту тему можно удалить за ненадобностью.

темы не удаляются - ибо таких как вы могут быть много, вдруг кому еще нужно будет, вы бы хоть написали как исправили

[Luara]

С удовольствием поделюсь.
Помог z-index.
Изучив внимательно код вот отсюда: http://redspirit.ru/notes/mnogourovn...istom-css.html
и сравнив его с тем, что имелось у меня, я попробовала в панели разработчика добавить элементам подменю css-свойство z-index (http://htmlbook.ru/css/z-index):

ul.menu-item-2 {
z-index: 1;
}

Хотя некоторые верстальщики говорят, что непонятно почему оно помогло.

[Serge_Bliznykov]

и опять перенёc тему, теперь в раздел HTML и CSS