меню:применила hover,но в ie8 он не перекрывает разделитель

[Nailya]

Всем привет!

Не работает в ie8:

Я создала горизонтальное меню: 4 пункта меню на зеленом фоне и между этими пунктами вертикальный разделитель(картинка).

Создала hover c серым фоном, но при наведении курсора фон закрывает все, кроме разделителя слева, который относится к предыдущему пункту.

И это происходит, если я веду курсором по пунктам меню СЛЕВА НАПРАВО, а если наоборот, то работает корректно,только разделитель чернеет, хотя он зеленого цвета

Как можно сделать так, чтобы и разделитель слева закрывался фоном и разделитель не чернел?

.Menu-2 {
margin:0;
padding:0;
float:left;
width:1200px;
height:40px;
background:url(/template/menu/menu_1/img/menu2_line.png) no-repeat;
}
.Menu-2 li {
margin:0;
padding:0;
float:left;
list-style-type:none;

}
.Menu-2 li a {
display:block;
min-width:130px;
height:40px;
font-weight:bold;
text-align:center;
color:#FFF;
cursor:pointer;
font-size:14px;
margin-left:-1px;
background: url(/template/menu/menu_1/img/menu_razdelitel.png) no-repeat right;

}
.Menu-2 li a span {
line-height:36px;
border-bottom:1px dotted #FFF;


}

.Menu-2 li.select a {
background: #1dbb50;
color:#000;
}
.Menu-2 li a:hover {
background: #1dbb50;
color:#333;
-webkit-transition: background 0.5s ease;
-moz-transition: background 0.5s ease;
transition: background 0.5s ease;

filter: Alpha(opacity=100);


}

Хотела еще добавить про разделитель: разделитель справа чернеет у пункта меню, когда отводишь курсор

[Justnewone]

Расположите где-нибудь и поделитесь ссылкой, пожалуйста.

[Nailya]

http://enjoyflowers.ru/ - зеленое меню, но это боевой сайт, к сожалению здесь я еще не приминяла этот проблемный код, он на локалке:

-webkit-transition: background 0.5s ease;

-moz-transition: background 0.5s ease;

transition: background 0.5s ease;

filter: Alpha(opacity=100);

[Justnewone]

http://jsfiddle.net/