[Résolu] Liste horizontale et "largeur élastique"

Bonjour,
J'ai un petit souci de compatibilité avec IE7

Je dois utiliser le code html suivant, mais je ne suis pas maître du nombre d'items: ils sont contribués:

<div id="main_menu" class="noindex">
	<ul class="noindex">
		<li  class="first"><a href="#">Item1</a></li>
		<li class="separator"></li>
		<li>Item2</li>
		<li class="separator"></li>
		<li>Item3</li>
		<li class="separator"></li>
		<li>Item4</li>
		<li class="separator"></li>
		<li class="last">Item5</li>
	</ul>
</div>

Les styles associés (tous navigateurs):

div#main_menu
{
    height:40px;
    float:left;   
    position:relative;
}
div#main_menu ul  
{
    height:40px;
    width: 762px;
    -webkit-border-radius:6px;
    -moz-border-radius:6px;
    border-radius:6px;		
    list-style:none;
    position:relative;
    text-align: center;
    margin: 0;
    padding: 0;
    display: table;
	background-color: grey;
}
div#main_menu ul li
{
    height:40px;
    text-align:center;
    display:table-cell;
    list-style:none;
    float: none;
	background-color: olive;
	border-right: 1px solid red;
}

Ce code fonctionne globalement comme je le souhaite, sauf pour Internet Explorer 7, malgré l'ajout de ce code spécifique:

div#main_menu ul li{
		float: left;
		display: table-cell;
}

Quelqu'un aurait une idée de contournement?

Merci pour vos retours

Bonjour,
normal les valeur table-machin ne sont pas implémentées par IE7-.
Il faut transformer certaines balises en table/tr/td via les commentaires conditionnels ou passer par cette solution (attention c'est assez délicat à utiliser)
http://tanalin.com/en/projects/display-table-htc/

Attention, les élément rendus flottants ou positionnés de manière absolu ou fixe font passer la valeur du display à block (et à table pour un élément en inline-table) de manière transparente, ce qui annule ici le table-cell.
Modifié par Hermann (04 Apr 2013 - 14:21)

Merci Hermann,
Vu l'ampleur du projet, il ne m'est pas possible d'utiliser les commentaires conditionnels pour transformer les balises en table-tr-td, et encore moins d'utiliser un .htc

En tous cas, merci pour la précision sur les élément rendus flottants ou positionnés de manière absolu ou fixe qui font passer la valeur du display à block (et à table pour un élément en inline-table) de manière transparente, ce qui annule ici le table-cell.
Modifié par speedlab (04 Apr 2013 - 14:40)