18041 sujets

Questions générales et questions de débutants

Comportement dirrérent entre firefox et IE8

Bonjour,

j'ai un comportement dirrérent entre firefox et IE8, et je n'arrive pas à le résoudre.

<CODE HTML>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<title>essai menu</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content=" css, dropdowns, dropdown menu, drop-down, menu" />
<meta name="description" content="Clean, standards-friendly, modular framework for dropdown menus" />

<link href="style3.css"   media="screen" rel="stylesheet" type="text/css" />

</head>

<body>

<ul id="menu">
   <li class="menu1"><a href="#">Home</a></li>
   <li class="menu1 fleche_down">About us
      <ul>
         <li class="menu2"><a href="#">History</a></li>
	     <li class="menu2 fleche_right">The team
          <ul>
	       <li class="menu2"><a href="#">Khalil<a></li>
	       <li class="menu2"><a href="#">Amine<a></li>
	       <li class="menu2"><a href="#">Ayoub<a></li>
	       <li class="menu2 menu2_dernier"><a href="#">Bachir<a></li>
	      </ul>
         </li>
         <li class="menu2 menu2_dernier"><a href="#">Our vision</a></li>
      </ul>
   </li>
   <li class="menu1 menu1_dernier"><a href="#">Clients</a></li>
</ul>

</body>

</html>


<CODE CSS>


*{
 margin: 0;
 padding: 0; 
}

#menu li,
#menu ul{
 margin: 0;
 padding: 0;
 list-style-type: none;
}

ul#menu{
 position: relative;
 z-index: 1;
}

ul#menu li{
 float: left;
}

ul#menu ul{
 float: none;
}

ul#menu li:hover{
 position: relative;
 z-index: 3;
}

ul#menu ul{
 visibility: hidden;
 position: absolute;
 top: 100%;
 left: 0;
 z-index: 2;
}

ul#menu ul ul{
 top: 1px;
 left: 99%;
}

ul#menu li:hover > ul{
 visibility: visible;
}

ul#menu a{
 text-decoration: none;
 color: black;
}

ul#menu li{
 color: black;
 background-color: #aaa;
 padding: 0 5px;
 width: 110px;
 text-align: center;
 line-height: 2.1em;
}

ul#menu a:hover{
 color: brown;
}

ul#menu li:hover,
ul#menu li:focus{
 color: brown;
 background-color: #eee;
}

ul#menu li.fleche_down {
 background-image: url("./images/nav-arrow-down.png");
 background-position: 100% 50%;
 background-repeat: no-repeat;
}

ul#menu li.fleche_right {
 background-image: url("./images/nav-arrow-right.png");
 background-position: 100% 50%;
 background-repeat: no-repeat;
}

ul#menu li.menu1{
 border-top: 1px solid black;
 border-bottom: 1px solid black;
 border-left: 1px solid black;
}

ul#menu li.menu1_dernier{
 border-right: 1px solid black;
}

ul#menu li.menu2{
 border-top: 1px solid black;
 border-right: 1px solid black;
 border-left: 1px solid black;
}

ul#menu li.menu2_dernier{
 border-bottom: 1px solid black;
}


MERCI
Modifié par khaic (05 May 2011 - 15:10)
Bonjour, ce serait bien de savoir quel est la différence...

Une question précise donne de meilleurs chances d'avoir une réponse à un problème. Smiley cligne
Bonjour et bienvenue parmi nous Smiley smile

En tant que modérateur, je me dois de te faire remarquer que tu n'as malheureusement pas respecté l'une des Règles de base du forum qui est d'afficher les codes et exemples proprement à l'aide des boutons [ code]... ici ton code HTML, CSS, PHP, etc.[ /code] (sans espace).

Je te remercie par avance de bien vouloir éditer ton message afin de le rendre conforme à cette règle. Smiley cligne

D'ailleurs, je rappelle que le lien "Aide" qui apparaît tout en haut du forum est important. Il contient des pistes de recherche, des indications sur les règles de vie de la communauté, etc.
Il serait courtois de ta part de bien vouloir en prendre connaissance.

Bonne continuation Smiley smile

upload/1-code.gif
Bonsoir,

Mabelle a écrit :
Bonjour, ce serait bien de savoir quel est la différence...


Remarque d'autant plus pertinente que sur mon ordi (windows 7), je ne perçois AUCUNE différence entre IE8 et FF 3.6.17.

Pourrais-tu préciser?

Cordialement
Sujet clos
Aller à