Menu d'onglets, encore un :hover réfractaire sous IE

Bonjour à tous,

J'ai un petit soucis sur une barre d'onglet sous Internet Explorer 6

La barre est construite selon le principe des portes coulissantes (voir http://www.ultra-fluide.com/ressources/css/menu-onglets.htm )

J'ai rajouté un effet de :hover dessus en prenant bien soin de l'appliquer aux liens justement POUR que cela soit pris en compte par IE mais lorsque je passe la souris sur mon onglet, lorsque celui-ci est plus long que les autres et qu'il laisse apparaitre un tronçon de la coulisse d'en dessous, je me rend compte que celle-ci est encore bleue.


Dans le présent exemple, la page active est celle de la F.A.Q.
et là, ma souris est sur l'onglet actualité.

http://www.loiseau2nuit.net/misc/tabs_bug.png
Je sais que les choix de couleurs ne sont pas tops, mais je ne fais que ce que l'on me demande

Le code :

/* Barre d'onglets */
#banner #tabs {
	float: left;
	width:100%;
	font-size:120%;
	line-height:normal;
	/* margin: 145px 0 10px 0; */
	position:absolute;
	top: 150px;
	left: 0px;
}
#banner #tabs .first_level ul {
	margin:0;
	padding:10px 10px 0;
	list-style:none;
}
#banner #tabs .first_level li {
	min-width:92px !important;
	float:left;
	background: url(/images/propass/tab_off.gif) no-repeat right top;
	margin:0;
	padding:0 0 0 0px;
}
#banner #tabs .first_level li:hover {
	min-width:92px !important;
	float:left;
	background: url(/images/propass/tab_on.gif) no-repeat right top;
	margin:0;
	padding:0 0 0 0px;
}
#banner #tabs .first_level a {
	display: block;
	background:url(/images/propass/tab_off.gif) no-repeat left top;
	padding:5px 15px 5px 15px;
	/* Pour IE Mac uniquement \*//*/   
	float:left;
	/**/
	color: #FFF;
	text-decoration: none;
	font-size: 1em;
}
#banner #tabs .first_level a:hover {
	display: block;
	background:url(/images/propass/tab_on.gif) no-repeat left top;
	padding:5px 15px 5px 15px;
	/* Pour IE Mac uniquement \*//*/   
	float:left;
	/**/
	color: #FFF;
	font-size: 1em;
	font-weight: bold;
}
#banner #tabs .first_level li.active {
	background-image:url(/images/propass/tab_on.gif);
}

#banner #tabs  .first_level li a:link {
	background-image:url(/images/propass/tab_off.gif);
	padding-bottom:5px;
	color: #FFF;
	text-decoration: none;
	font-size: 1em;
}
#banner #tabs .first_level li a:active {
	background-image:url(/images/propass/tab_on.gif);
	padding-bottom:5px;
	color: #FFF;
	text-decoration: none;
	font-size: 1em;
}
#banner #tabs .first_level li a:visited {
	background-image:url(/images/propass/tab_off.gif);
	padding-bottom:5px;
	color: #FFF;
	text-decoration: none;
	font-size: 1em;
}
#banner #tabs .first_level li a:hover {
	background-image:url(/images/propass/tab_on.gif);
	padding-bottom:5px;
	color: #FFF;
	font-weight:bold;
	font-size: 1em;
}

#banner #tabs  .first_level li.active a:link {
	background-image:url(/images/propass/tab_on.gif);
	padding-bottom:5px;
	color: #FFF;
	text-decoration: none;
	font-size: 1em;
}
#banner #tabs .first_level li.active a:active {
	background-image:url(/images/propass/tab_on.gif);
	padding-bottom:5px;
	color: #FFF;
	text-decoration: none;
	font-size: 1em;
}
#banner #tabs .first_level li.active a:visited {
	background-image:url(/images/propass/tab_on.gif);
	padding-bottom:5px;
	color: #FFF;
	text-decoration: none;
	font-size: 1em;
}
#banner #tabs .first_level li.active a:hover {
	background-image:url(/images/propass/tab_on.gif);
	padding-bottom:5px;
	color: #FFF;
	font-weight:bold;
	font-size: 1em;
}
/* /END barre d'onglets */

Quelqu'un voit-il où j'ai pu oublier quelque chose ?

Merci beaucoup et bonne journée à tous.
Modifié par Zzz. (11 Sep 2007 - 10:34)