[Résolu] Menu avec rollover css et float et décalage avec IE

Bonsoir,

Voilà ça fait quelques heures que je suis dessus, et le menu qui passe bien sous Firefox et Opera ne s'affiche pas dans IE comme je le souhaiterais.
Et mes yeux fatiguent, je ne vois pas le problème qui devrais me sauter aux yeux.

Voir la page en ligne

Feuille de style:

#menu{
	background-color: #DEE791;
	background-image: url(fonds.png) repeat-x 0;
	width:540px;
	height:25px;
}
#menu ul li{
	list-style-type: none;
	margin:0;
}
#menu ul li a{
	display:block;
	float:left;
	height:25px;
	width:60px;
	line-height: 25px;	/*hauteur de ligne*/
	color: #fff;
	font-weight:bold;
	text-decoration: none; 	/*ne pas souligner les liens*/
	padding-left: 10px; 	/*débuter le texte à 10 px du bord gauche*/
	background: url(roll_menu.png) no-repeat 0 0;
}
#menu ul li a:hover{
	background: url(roll_menu.png) no-repeat 0 -25px;/*décalage de l'image pour l'effet*/
	color:#6E7E8B;
}

Le code html:

<div id="menu">

        <ul>
          <li>
            <a href="index.html">Accueil</a>
          </li>
          <li>
            <a href="extraits.html">Extraits</a>
          </li>
          <li>

            <a href="contact.html"
            title="Contactez Sylvain Picot">Contacts</a>
          </li>
          <li>
            <a href="technique.html"
            title="fiche technique pour les concerts">Technique</a>
          </li>
          <li>
            <a href="photos.html">Photos</a>

          </li>
          <li>
            <a href="bio.html">Bio</a>
          </li>
        </ul>
      </div>

Si j'abusais, si une bonne âme utilisatrice de Mac pouvais m'envoyer une capture sous Safari par mail
Modifié le 05 Dec 2004 - 01:47

Je ne mettais pas le float au bon endroit. Mais quel c..

Le code qui fonctionne aussi avec IE:

/*Menu de navigation principal avec rollover
-------------------------------------------------------------------
*/
#menu{
	background-color: #DEE791;
	background-image: url(fonds.png) repeat-x 0;
	width:540px;
	height:25px;
}
[b]#menu li{
	list-style-type: none;
	margin:0;
	float:left;
}[/b]
#menu ul li a{
	display:block;
	height:25px;
	width:60px;
	line-height: 25px;	/*hauteur de ligne*/
	color: #fff;
	font-weight:bold;
	text-decoration: none; 	/*ne pas souligner les liens*/
	padding-left: 10px; 	/*débuter le texte à 10 px du bord gauche*/
	background: url(roll_menu.png) no-repeat 0 0;
}
#menu ul li a:hover{
	background: url(roll_menu.png) no-repeat 0 -25px;/*décalage de l'image pour l'effet*/
	color:#6E7E8B;
}

Juste un petit conseil esthétique :
Mettre les paragraphes en alignement justifié, surtout sur cette page où ça rendrait 10 fois mieux je trouve : http://igor.ouvaton.org/sylvain_picot/bio.html

Sinon, j'aime bien le design, même si t'as pas demandé

Il fonctionne bien le script de galerie photo ? (j'ai pas eu l'occasion de le tester en grandeur nature )

ElMoustiko a écrit :
Juste un petit conseil esthétique :
Mettre les paragraphes en alignement justifié, surtout sur cette page où ça rendrait 10 fois mieux je trouve : http://igor.ouvaton.org/sylvain_picot/bio.html

J'ai testé en justifié, mais je suis pas fan, dès que j'ajoute une image, la largeur diminue et donne avec la justification des espaces pas très gracieux, et comme je suis partie sur un design assez étroit...

a écrit :
Sinon, j'aime bien le design, même si t'as pas demandé

J'ai pas demandé mais ça fait toujours plaisir.

a écrit :
Il fonctionne bien le script de galerie photo ? (j'ai pas eu l'occasion de le tester en grandeur nature )

Je les installé aujourd'hui et tout à l'air ok. Merci encore.

J'ai testé avec Edit CSS pour l'alignement justifié, et même avec les espaces assez important, je trouve ça moins anarchique, plus esthétique, mais c'est toi le boss, c'etait juste mon avis

Si tu rencontre un bug, un soucis ou autre avec la galerie, demande moi, ça m'interesse, pas eu de beta testeur ^^
Modifié le 05 Dec 2004 - 02:21

Par contre, si tu permet, j'ai quelque remarques au niveau du code :

*Un poil trop de div à mon gout
*Pourquoi un <ul> par titre de menu ??? c'est prévu pour faire un menu déroulant ???
*Le contraste sur le menu est moyen et le changement de couleur au passage de la souris sur les liens est carrément illisible

Sinon, question bête, pourquoi tu code tes accents ??

Bien d'accord pour la div du menu, d'ailleurs j'avais débuter avec un ul#roll li etc. qui me convenais, et je penses que je vais y revenir, c'est avec le passage à une div que j'ai mer...

Sinon je ne les code pas les accents, c'est HTML-Kit qui s'en charge

Sur ce, bonne nuit