Проблема с версткой меню в IE

[nuuta]

Здравствуйте!

У меня произошел затык с версткой меню в IE 7 и выше. Меню второго уровня отображается под слоем меню первого уровня. Не могу понять в чем дело и решить проблему, а сроки поджимают.

CSS

#navmenu-v,
ul#navmenu-v li,
ul#navmenu-v ul {
  margin: 0;
  border: 0 none;
  padding: 0;
  width: 200px;
  list-style: none;
  font-family: Arial; /*my*/
  font-size: 10pt; /*my*/
}

ul#navmenu-v:after {
  clear: both;
  display: block;
  position: absolute;
  font: 1px/0px serif;
  content: ".";
  height: 0;
  visibility: hidden;
}


ul#navmenu-v li {
  float: left; 
  display: block !important; 
  display: inline;
  position: relative;
  border: 0px solid #C1C1C1;
}


ul#navmenu-v li ul li {
	border:none;
	border-bottom:#FFFFFF 1px solid;
}

/* Root Menu */
ul#navmenu-v a {
  padding: 0 6px;
  display: block;
  padding: 0 0 0 10px;
  background: transparent; /*my*/
  color: #660000;
  font: bold 10pt/20pt Arial;
  text-decoration: none;
  height: auto !important;
  height: 1%;
  border: 1px solid transparent; /*my*/
}


ul#navmenu-v a:hover,
ul#navmenu-v li:hover a,
ul#navmenu-v li.iehover a {
  background: #FFFFFF;
  border: 1px solid #C1C1C1;
  color: #990000;
}

/* 2nd Menu */
ul#navmenu-v li:hover li a,
ul#navmenu-v li.iehover li a {

  display: block;
  width: 200px;
  z-index: 1000; /*my*/
  background: #FFFFFF;
  border: 1px solid #C1C1C1;
  color: #333333;
}


ul#navmenu-v li:hover li a:hover,
ul#navmenu-v li:hover li:hover a,
ul#navmenu-v li.iehover li a:hover,
ul#navmenu-v li.iehover li.iehover a {
  background: #FFFFFF;
  color: #990000;
}



ul#navmenu-v ul,
ul#navmenu-v ul ul,
ul#navmenu-v ul ul ul {
  display: none;
  position: absolute;
  top: 0;
  left: 199px;
}


* html ul#navmenu-v li { float: left; height: 1%; } 
* html ul#navmenu-v li a { height: 1%; }

ul#navmenu-v li:hover ul ul,
ul#navmenu-v li.iehover ul ul,
ul#navmenu-v li:hover ul ul ul,
ul#navmenu-v li.iehover ul ul ul 
{
	/*top:-999em;*/
	display:none;
}

/*Submenu show*/
ul#navmenu-v li:hover ul,
ul#navmenu-v li.iehover ul,
ul#navmenu-v li li:hover ul,
ul#navmenu-v li li.iehover ul,
ul#navmenu-v li li li:hover ul,
ul#navmenu-v li li li.iehover ul
{
	z-index:1000;
	/*top:auto;*/
	display:block;
}

/*my*/

ul#navmenu-v li:hover a.root-item,
ul#navmenu-v li.iehover a.root-item 
{
   background-color: #FFFFFF;
   border:1px solid #C1C1C1;
}

ul#navmenu-v li a.item-selected
{ 
	background-color: #fff;
}

ul#navmenu-v a.root-item
{
	color: #660000;
	font-weight:bold;
	font-size:10pt;
	font-family: Arial;
	background-color: transparent;
    border:1px solid transparent;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	width: 200px;
	overflow:hidden;
}

ul#navmenu-v a.root-item-selected
{
	color: #990000;
	font-weight:bold;
	font-size:10pt;
	font-family: Arial;
	background-color: transparent;
	border:1px solid transparent;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	width: 200px;
	overflow:hidden;
}


ul#navmenu-v a.root-item:hover,
ul#navmenu-v a.root-item-selected:hover
{
	background-color: #fff;
    width: 200px;
}

Сам сайт, где посмотреть баг тут.

Во всех остальных браузерах отображение адекватное. Помогите, пожалуйста!

[moskalev_mihail]

Если проблема в том, что раскрывающееся меню уходит под след колонку, то тут дело в z-index, на сколько я помню IE применяет его тогда, когда предок элемента относительно спозиционирован и у него прописан z-index. Могу ошибаться.

А еще в IE7 прокрутка горизонтальная появляется

[Justnewone]

ul#navmenu-v li {

position: relative;

}

ul#navmenu-v li:hover {

position: relative;

z-index:стопицот /*опционально*/

}

[nuuta]

Спасибо большое! Очень помогло!!!

ul#navmenu-v li {

position: relative;

}

ul#navmenu-v li:hover {

position: relative;

z-index:стопицот /*опционально*/

}