Menu CSS qui ne fonctionne pas sous IE6

[OTP]

Bonjour,

Nouvelle version, nouveaux soucis...

Mon menu CSS ne fonctionne pas sous IE6 : http://www.thewindpower.net/

Comment contourner ce souci ?

Merci,

OTP

[milkiway]

Contourner : en affichant un message qu'il faut changer de navigateur
Résoudre :

Code: Tout sélectionner

<!--[if lte IE 7]>
<link rel="stylesheet" type="text/css" href="ie6.css" />
<![endif]-->


[OTP]

On va tenter de résoudre alors !

Je mets quoi dans mon ie6.css, dans mon cas ?

[Théophraste]

Sous ie 6, la Une de wri bug aussi depuis 2 jours, pour info au passage .

[cedric_g]

Une bonne résolution : http://www.ie6nomore.com

Désormais, je facture la mise en compatibilité IE6... Et sur mes propres sites, franchement j'hésite !

[milkiway]

Non Cedric, tu ne peux pas dire et faire ça.
Certains publics utilisent massivement IE6 en 800x600 sur Windows 98 ou XP.
En france et dans d'autres pays francophones moins riches.

[Argonaute]

Non Cedric, tu ne peux pas dire et faire ça.
Certains publics utilisent massivement IE6 en 800x600 sur Windows 98 ou XP.
En france et dans d'autres pays francophones moins riches.

Tout à fait d'accord, même si cela baisse. Faut également penser aux entreprises qui sont parfois encore sous IE6.

[SpeedAirMan]

Désormais, je facture la mise en compatibilité IE6... Et sur mes propres sites, franchement j'hésite !

Je pense que je vais me mettre à facturer la compatibilité IE6 également... c'est vraiment chiant et ça prend trop de temps.
En travaillant bien ses CSS et en connaissant 2 ou 3 hacks, ça passe bien, mais quand même...

Perso, sur mes propres sites (futurs sites), c'est décidé : les utilisateurs d'IE6 auront soit un message les invitant à passer à IE8 ou à un navigateur alternatif (la mise à jour est gratuite, faut pas se foutre de la gueule du monde. Ce navigateur a 10 ans quand même !), soit ils auront accès à une version grisée par belle. Soit les deux aussi



Michael (@OTP): le menu css & jquery SuperFish fonctionne bien sur IE6
(testé à l'instant via IETester).
Tu peux avoir le même rendu visuel en modifiant le CSS de SuperFish.

Edit: snif, et mon bloc newsletter alors ?

[milkiway]

Mais franchement, vous en avez beaucoup vous ? Moi en général il suffit de deux lignes de CSS spécifiques et tout est bon pour IE6.

[OTP]

Justement, si quelqu'un savait me dire ce qui coince là-dedans pour IE6...

Code: Tout sélectionner

.menu{
   border:none;
   border:0px;
   margin:0px;
   padding:0px;
   font: 67.5% Arial, Helvetica, serif;
   font-size:17px;
   font-weight:bold;
   }
.menu ul{
   background:#145595;
   height:30px;
   list-style:none;
   margin:0;
   padding:0;
   }
.menu li{
   float:left;
   padding:0px;
   }
.menu li a{
   background:#145595 url("http://www.thewindpower.net/images/site/menu/seperator.gif") bottom right no-repeat;
   color:#FFFFFF;
   display:block;
   font-weight:normal;
   line-height:30px;
   margin:0px;
   padding:0px 25px;
   text-align:center;
   text-decoration:none;
   }
.menu li a:hover, .menu ul li:hover a{
   background: #2580a2 url("http://www.thewindpower.net/images/site/menu/seperator.gif") bottom right no-repeat;
   color:#FFFFFF;
   text-decoration:none;
   }
.menu li ul{
   background:#2580a2;
   display:none;
   height:auto;
   padding:0px;
   margin:0px;
   border:0px;
   position:absolute;
   width:225px;
   z-index:200;
   /*top:1em;
   /*left:0;*/
   }
.menu li:hover ul{
   display:block;
   }
.menu li li {
   background:url('http://www.thewindpower.net/images/site/menu/sub_sep.gif') top left no-repeat;
   display:block;
   float:none;
   margin:0px;
   padding:0px;
   width:225px;
   }
.menu li:hover li a{
   background:none;
   }
.menu li ul a{
   display:block;
   height:28px;
   font-size:12px;
   font-style:normal;
   margin:0px;
   padding:0px 10px 0px 15px;
   text-align:left;
   }
.menu li ul a:hover, .menu li ul li:hover a{
   background:#B6B9BC url('http://www.thewindpower.net/images/site/menu/sub_sep.gif') top left no-repeat;
   border:0px;
   color:#000000;
   text-decoration:none;
   }
.menu p{
   clear:left;
   }