rss
Rechercher : dans
Par : Pertinence Date Nom d'utilisateur
Statut : Non résolu

Pbm compatibilité css IE7

Gautrish, le mercredi 9 janvier 2008 à 19:38:15
Bonjour,
J'ai voulu créer un menu déroulant pour mon site inernet. http://stmarcfoot.free.fr/
Le problème est qu'avec le navigateur IE7 les menus restent fixes.

Voici mon code css:
table {border-collapse:collapse; border:0; margin:0; padding:0;}
body {font-size:62.5%; font-family:verdana,arial,sans-serif; background-color:rgb(255,255,255)}

.menu {
white-space:nowrap /*IE hack*/;
float:left; width:720px;
text-align:center; color: rgb(255,255,255);
border:none; font-size:14px;
}
.menu ul {
list-style-type:none;
}
.menu ul li {
float:left;
z-index:auto !important /*Non-IE6*/;
z-index:1000 /*IE6*/;
}
.menu ul li a {
float: none !important /*Non-IE6*/;
float:left /*IE-6*/; display:block;
padding-left:26px;
padding-right: 26px;
height:1.9em;
line-height:1.75em;
text-decoration:none;
font-weight:bold;
color: rgb(255,255,255);
}
.menu ul li ul {
display:none;
border:none;
}

/*------------------------------------Non-IE6 hovering------------------------------------*/
.menu ul li:hover {
position:relative;
}
.menu ul li:hover a {
background-image: url('images/menu/sousmenu.png');
text-decoration:none;
}
.menu ul li:hover ul {
display:block;
width:10.0em;
position:absolute;
z-index:999;
top:1.85em;
margin-top:0.1em;
left:0;
}
.menu ul li:hover ul li a {
white-space:normal;
display:block;
width:11em;
height:auto;
line-height:18px;
margin-left:-1px;
padding:4px 20px 4px 20px;
border-left:solid 1px rgb(255,255,255);
border-top:solid 1px rgb(255,255,255);
border-bottom: solid 1px rgb(255,255,255);
background-image: url('images/menu/sousmenu.png');
font-weight:normal;
color:rgb(255,255,255);
}
.menu ul li:hover ul li a:hover {
background-image: url('images/menu/sousmenu_inv.png');
text-decoration:none;
}


/*-----------------------------------IE6 hovering--------------------------------*/
.menu table {
position:absolute;
top:0; left:0;
border-collapse:collapse;
}
.menu ul li a:hover {
position:relative /*IE hack*/;
z-index:1000 /*IE hack*/;
background-image: url('images/menu/sousmenu.png');
text-decoration:none;
}
.menu ul li a:hover ul {
display:block;
width:10.0em;
position:absolute;
z-index:999;
top:1.5em;
left:0;
margin-top:0.1em;
}
.menu ul li a:hover ul li a {
white-space:normal;
display:block;
width:10.0em;
height:1px;
line-height:1.3em;
margin-left:-1px;
padding:4px 20px 4px 20px;
border-left:solid 1px rgb(255,255,255);
border-top:solid 1px rgb(255,255,255);
border-bottom: solid 1px rgb(255,255,255);
background-image: url('images/menu/sousmenu.png');
font-weight:normal;
color:rgb(255,255,255);
}
.menu ul li a:hover ul li a:hover {
background-image: url('images/menu/sousmenu_inv.png');
text-decoration:none;
}

@media print {.menu {float:left; width:800px; border:none; background:rgb(240,240,240); color:rgb(75,75,75); font-size:1.0em; font-size:130%;}}


Pour le HTML:

<div class="menu">

<!-- un menu de navigation -->
<!-- un menu de navigation avec sous-menus-->
<ul>
<li><a href="#">Equipes<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="pages/equipes/seniors.htm">Seniors</a></li>
<li><a href="pages/equipes/feminines.htm">Féminines</a></li>
<li><a href="pages/equipes/18.htm">18ans</a></li>
<li><a href="pages/equipes/15.htm">15ans</a></li>
<li><a href="pages/equipes/13.htm">13ans</a></li>
<li><a href="pages/equipes/Benjamins.htm">Benjamins</a></li>
<li><a href="pages/equipes/Poussins.htm">Poussins</a></li>
<li><a href="pages/equipes/Debutants.htm">Débutants</a></li>
<li><a href="pages/equipes/Loisirs.htm">Loisirs</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>

<!-- un menu de navigation avec sous-menus-->
<ul>
<li><a href="#">Convocations<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="pages/Convocations/Seniors.pdf">Seniors</a></li>
<li><a href="pages/Convocations/15ans.pdf">15ans</a></li>
<li><a href="pages/Convocations/13ans.pdf">13ans</a></li>
<li><a href="pages/Convocations/Benjamins.pdf">Benjamins</a></li>
<li><a href="pages/Convocations/Poussins.pdf">Poussins</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>

<ul>
<li><a href="pages/contacts.htm">Contacts</a></li>
</ul>

<ul>
<li><a href="pages/historique.htm">Historique</a></li>
</ul>

<ul>
<li><a href="#">Autres<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="pages/charte.htm">Charte</a></li>
<li><a href="pages/Entrainements.html">Entraînements</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>


<!-- un menu de navigation avec sous-menus-->
<ul>
<li><a href="#">Liens<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="http://www.fff.fr/">FFF</a></li>
<li><a href="http://foot44.fff.fr/cg/0601/www/actualite/index.shtml">District</a></li>
<li><a href="http://www.mairie-saintnazaire.fr/">Ville de St-Nazaire</a></li>
<li><a href="http://stmarcfoot-feminines.skyrock.com/">Blog des Féminines</a></li>

</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>
</div>
Configuration: Windows XP
Firefox 2.0.0.11
Répondre à Gautrish  Signaler ce message aux modérateurs Aller au dernier message

1


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
 Carotte77, le jeudi 10 janvier 2008 à 11:12:23
Bonjour,

Je comprend ton problème. Ces sites devraient t'aider (si ce n'est pas le cas, reviens ici !)

http://forum.alsacreations.com/topic-1-20215-1-Probleme-menu­-CSS-avec-IE7.html
http://www.clubic.com/...

C'est tout ce que j'ai trouvé... pour le moment !
Cochez "Problème résolu" au début de la discussion lorsque votre problème est résolu ! Merci ;)
Répondre à Carotte77
Logiciels pertinents trouvés dans les téléchargements
Télécharger Power IE6  3.00Power IE6 - Power IE 6 est compatible avec Internet Explorer 7, c'est un logiciel d'origine canadienne, qui vous permet en quelques...Catégorie: Anonymat/Confidentialité
Licence: Freeware/gratuit
Télécharger IE7 open last closed tab 3.5.0.0IE7 open last closed tab - Quoi de plus énervant lorsqu'on utilise un navigateur que de fermer accidentellement un onglet ! Mozilla Firefox et Opera...Catégorie: Navigateurs
Licence: Freeware/gratuit
Télécharger 7Zip 4.577Zip - 7-Zip est un utilitaire de compression/décompression libre pour systèmes Windows 32-bit. Il est très simple à utiliser:...Catégorie: Compression/Décompression
Licence: Open Source
Télécharger Internet Explorer 7Internet Explorer - Internet Explorer 7 est la dernière version du navigateur phare de Microsoft, intégrant les derniers correctifs en matière...Catégorie: Navigateurs
Licence: Freeware/gratuit
Plus de logiciels gratuits sur « Pbm compatibilité css IE7 »