Bug <a> float left sur IE7

Bonjour

Dans mon header j'ai un menu horizontal qui se déplie (animation jQuery), et qui contient des liens en display:block + float:left, chaque lien contenant un élément <i> qui contient une icône en background image.

Sur internet explorer 7 (IE9 en mode IE7), le float left ne fonctionne pas, tous les liens s'affichent les uns en dessous des autres.

J'ai uploadé une page qui montre le problème :
http://finalclap.free.fr/TEMP/FORUMS/fc-bug-css-ie7-slide/

Voici la portion de code CSS qui concerne ce menu :

#tutoriaux a{
	display:block; float:left; margin:0 14px 5px; padding:17px 12px 5px;
	text-decoration:none; text-align:center; line-height:32px; color:#555555;
	-webkit-border-radius:5px;
	   -moz-border-radius:5px;
	        border-radius:5px;
}
#tutoriaux a:hover{background:#e8e8e8; color:black;}
#tutoriaux a>i{
	display:block; width:64px; height:64px; margin:0 auto;
	background:url('images/sprite-slider.png') 64px 0 no-repeat;
}

Apparemment c'est les <i> en display block qu'il n'aime pas, quand je l’enlève, le float left fonctionne à nouveau.

Comment je peux faire ? j'ai absolument besoin d'afficher l'icône, et je ne souhaite pas utiliser des <img/> à la place du background-image (je tiens à mon sprite CSS).

Je suis ouvert à toute solution, même une solution "crade" en javascript (on s'en fou, c'est juste pour les 10% de pleu-pleu qui utilisent encore IE7...).

Merci
Modifié par Galdon (02 Feb 2013 - 17:35)

C'est parce tu as mis dans

#tutoriaux a{}

un display:block mais que tu n'a pas renseigner de largeur. Du coup IE l'intéprete comme un block normal a savoir 100% de la largeur.

Suffit donc de lui ajouter un petit width
Modifié par Cancre (04 Feb 2013 - 14:21)

Galdon a écrit :
Je suis ouvert à toute solution, même une solution &quot;crade&quot; en javascript (on s'en fou, c'est juste pour les 10% de pleu-pleu qui utilisent encore IE7...).

Sérieusement ? Vous avez encore 10% d'utilisateurs IE7 ? Du coup je me suis amusé à calculer avec Google Analytics : chez moi la fréquentation IE7 est de l'ordre de 0,3% (édit : le mois dernier)...
Modifié par Olivier C (04 Feb 2013 - 18:57)

Olivier C a écrit :

Sérieusement ? Vous avez encore 10% d'utilisateurs IE7 ? Du coup je me suis amusé à calculer avec Google Analytics : chez moi la fréquentation IE7 est de l'ordre de 0,3% (édit : le mois dernier)...

Non j'ai dit ça à la louche.
Je viens aussi d'aller vérifier, en fait non, y'en a que 0.50%
J'aurais peut-être du faire ça en premier...

Internet explorer c'est vraiment plus ce que c'était, on en viendra peut-être à bout un jour ^^.

Bon. Merci pour votre stat : toujours intéressant à connaitre en regard d'un site concret (plutôt qu'une stat au niveau mondiale).

Pour compléter : J'ai vu IE7 chuter d'un seul coup au mois d'octobre. Idem pour IE6. J'avais entendu parler d'une mise à jour silencieuse de la part de Microsoft...