Pb compatibilité du site avec IE
papout
-
papout -
papout -
Bonjour,
j'ai un pb de compatibilité avec IE, les sous menus n'apparaissent pas... HELP !
Pour les autres navigateurs ca marche...
<html>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<link href="style.css" rel="stylesheet"
type="text/css">
<title>new</title>
</head>
<body>
<img style="width: 997px; height: 298px;" alt=""
src="RA_Site_Bandeau_12.jpg">
<div id="menu" style="margin-left: 150px; text-align: center;">
<ul class="niveau1">
<li class="sousmenu , plop"><a href="">Le
Spectacle</a>
<ul class="niveau2">
<li><a href="description.html">Description</a></li>
<li><a href="contributeur.html">Contributeurs</a></li>
<li><a href="atelier.html">Ateliers</a></li>
<li><a href="billetterie.html">Billetterie</a></li>
</ul>
</li>
<li class="sousmenu , plop"><a href="">La
Structure</a>
<ul class="niveau2">
<li class="sousmenu"><a href="">Première
partie </a>
<ul class="niveau3">
<li><a href="c0.html">Prologue</a></li>
<li><a href="c1.html">Chapitre 1</a></li>
<li><a href="c2.html">Chapitre 2</a></li>
<li><a href="c3.html">Chapitre 3</a></li>
<li><a href="c4.html">Chapitre 4</a></li>
<li><a href="c5.html">Chapitre 5</a></li>
<li><a href="c6.html">Chapitre 6</a></li>
</ul>
</li>
<li class="sousmenu"><a href="">Deuxième
partie</a>
<ul class="niveau3">
<li><a href="c7.html">Chapitre 7</a></li>
<li><a href="c8.html">Chapitre 8</a></li>
<li><a href="c9.html">Chapitre 9</a></li>
<li><a href="c10.html">Chapitre
10</a></li>
</ul>
</li>
</ul>
</li>
<li class="sousmenu , plop"><a href="">Le
Contenu</a>
<ul class="niveau2">
<li><a href="personnages.html">Personnages</a></li>
<li><a href="genealogie.html">Généalogie</a></li>
<li><a href="extraits.html">Extraits</a></li>
</ul>
</li>
<li class="sousmenu , plop"><a href="">Les
Auditions</a>
<ul class="niveau2">
<li><a href="informations.html">Informations</a></li>
<li><a href="etablissements.html">Etablissements
concernés</a></li>
<li><a href="planning.html">Planning</a></li>
<li><a href="documents.html">Documents</a></li>
<li><a href="roles.html">Exemples de
rôles</a></li>
</ul>
</li>
<li class="sousmenu , plop"><a href="">Au
jour le jour</a>
<ul class="niveau2">
<li><a href="calendrier.html">Calendrier</a></li>
<li><a href="6juin.html">Lecture 6 juin</a></li>
<li><a href="excalibur.html">Excalibur</a></li>
</ul>
</li>
<li class="sousmenu , plop"><a href="">Documentation</a>
<ul class="niveau2">
<li><a href="bretagne.html">"Matière
de
Bretagne"</a></li>
<li><a href="textes.html">Textes</a></li>
<li><a href="poemes.html">Poèmes</a></li>
</ul>
</li>
</ul>
</div>
<br>
<br>
Voilà le style.css
body {behavior: url(csshover.htc);}
div#menu a {color:#000000}
div#menu ul {padding: 0; margin:0px; background: white; text-align:center}
div#menu li {background:#CCCCCC}
div#menu li:hover {background: #EDD}
div#menu li.sousmenu:hover {background: #EBB;}
/* rejout couleur de fond */
div#menu li.sousmenu {background: url(*.gif) 95% 50% no-repeat; background-color:#CCCCCC}
/* rajout pr pour fleche direction bas et couleur de fond*/
div#menu li.plop { background:url(*.gif) 95% 50% no-repeat #CCCCCC;}
/* une petite bordure en top*/
div#menu ul li {position:relative; list-style: none; float:left; border-top:1px solid}
div#menu ul ul {position: absolute;display:none; width:100px}
div#menu li a {text-decoration: none; padding: 4px 0 4px; display:block;width:120px}
div#menu ul.niveau1 li.sousmenu:hover ul.niveau2,
div#menu ul.niveau2 li.sousmenu:hover ul.niveau3 {display:block;}
div#menu ul.niveau3 {top:-1px; left: 120px;}
/* rajout de couleur de fond et de survol */
div#menu ul.niveau3 li { background: #99CCCC}
div#menu ul.niveau3 li:hover { background: #99CC00}
j'ai un pb de compatibilité avec IE, les sous menus n'apparaissent pas... HELP !
Pour les autres navigateurs ca marche...
<html>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<link href="style.css" rel="stylesheet"
type="text/css">
<title>new</title>
</head>
<body>
<img style="width: 997px; height: 298px;" alt=""
src="RA_Site_Bandeau_12.jpg">
<div id="menu" style="margin-left: 150px; text-align: center;">
<ul class="niveau1">
<li class="sousmenu , plop"><a href="">Le
Spectacle</a>
<ul class="niveau2">
<li><a href="description.html">Description</a></li>
<li><a href="contributeur.html">Contributeurs</a></li>
<li><a href="atelier.html">Ateliers</a></li>
<li><a href="billetterie.html">Billetterie</a></li>
</ul>
</li>
<li class="sousmenu , plop"><a href="">La
Structure</a>
<ul class="niveau2">
<li class="sousmenu"><a href="">Première
partie </a>
<ul class="niveau3">
<li><a href="c0.html">Prologue</a></li>
<li><a href="c1.html">Chapitre 1</a></li>
<li><a href="c2.html">Chapitre 2</a></li>
<li><a href="c3.html">Chapitre 3</a></li>
<li><a href="c4.html">Chapitre 4</a></li>
<li><a href="c5.html">Chapitre 5</a></li>
<li><a href="c6.html">Chapitre 6</a></li>
</ul>
</li>
<li class="sousmenu"><a href="">Deuxième
partie</a>
<ul class="niveau3">
<li><a href="c7.html">Chapitre 7</a></li>
<li><a href="c8.html">Chapitre 8</a></li>
<li><a href="c9.html">Chapitre 9</a></li>
<li><a href="c10.html">Chapitre
10</a></li>
</ul>
</li>
</ul>
</li>
<li class="sousmenu , plop"><a href="">Le
Contenu</a>
<ul class="niveau2">
<li><a href="personnages.html">Personnages</a></li>
<li><a href="genealogie.html">Généalogie</a></li>
<li><a href="extraits.html">Extraits</a></li>
</ul>
</li>
<li class="sousmenu , plop"><a href="">Les
Auditions</a>
<ul class="niveau2">
<li><a href="informations.html">Informations</a></li>
<li><a href="etablissements.html">Etablissements
concernés</a></li>
<li><a href="planning.html">Planning</a></li>
<li><a href="documents.html">Documents</a></li>
<li><a href="roles.html">Exemples de
rôles</a></li>
</ul>
</li>
<li class="sousmenu , plop"><a href="">Au
jour le jour</a>
<ul class="niveau2">
<li><a href="calendrier.html">Calendrier</a></li>
<li><a href="6juin.html">Lecture 6 juin</a></li>
<li><a href="excalibur.html">Excalibur</a></li>
</ul>
</li>
<li class="sousmenu , plop"><a href="">Documentation</a>
<ul class="niveau2">
<li><a href="bretagne.html">"Matière
de
Bretagne"</a></li>
<li><a href="textes.html">Textes</a></li>
<li><a href="poemes.html">Poèmes</a></li>
</ul>
</li>
</ul>
</div>
<br>
<br>
Voilà le style.css
body {behavior: url(csshover.htc);}
div#menu a {color:#000000}
div#menu ul {padding: 0; margin:0px; background: white; text-align:center}
div#menu li {background:#CCCCCC}
div#menu li:hover {background: #EDD}
div#menu li.sousmenu:hover {background: #EBB;}
/* rejout couleur de fond */
div#menu li.sousmenu {background: url(*.gif) 95% 50% no-repeat; background-color:#CCCCCC}
/* rajout pr pour fleche direction bas et couleur de fond*/
div#menu li.plop { background:url(*.gif) 95% 50% no-repeat #CCCCCC;}
/* une petite bordure en top*/
div#menu ul li {position:relative; list-style: none; float:left; border-top:1px solid}
div#menu ul ul {position: absolute;display:none; width:100px}
div#menu li a {text-decoration: none; padding: 4px 0 4px; display:block;width:120px}
div#menu ul.niveau1 li.sousmenu:hover ul.niveau2,
div#menu ul.niveau2 li.sousmenu:hover ul.niveau3 {display:block;}
div#menu ul.niveau3 {top:-1px; left: 120px;}
/* rajout de couleur de fond et de survol */
div#menu ul.niveau3 li { background: #99CCCC}
div#menu ul.niveau3 li:hover { background: #99CC00}
A voir également:
- Pb compatibilité du site avec IE
- Compatibilite windows 11 - Guide
- Site de telechargement - Accueil - Outils
- Site x - Guide
- Site pour partager des photos - Guide
- Quel site remplace coco - Accueil - Réseaux sociaux
2 réponses
Bonjour,
Commencez déjà par mettre un doctype.
Je pencherais pour du html 4 au vu de la façon dont vous codez.
J'ai ajouté un </body> et un </html> à la fin...
Autre chose dont je ne suis pas sûr, pour mettre deux class à un élément, ce n'est pas comme ceci:
sousmenu , plop
mais
sousmenu plop
Séparés par des espaces si mes souvenirs sont bons.
Essayez de faire avec ces modifications, on avisera ensuite.
Commencez déjà par mettre un doctype.
Je pencherais pour du html 4 au vu de la façon dont vous codez.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta content="text/html; charset=ISO-8859-1" http-equiv="Content-Type"> <link href="style.css" rel="stylesheet" type="text/css"> <title>new</title> </head> <body> <img style="width: 997px; height: 298px;" alt="" src="RA_Site_Bandeau_12.jpg"> <div id="menu" style="margin-left: 150px; text-align: center;"> <ul class="niveau1"> <li class="sousmenu plop"><a href="">Le Spectacle</a> <ul class="niveau2"> <li><a href="description.html">Description</a></li> <li><a href="contributeur.html">Contributeurs</a></li> <li><a href="atelier.html">Ateliers</a></li> <li><a href="billetterie.html">Billetterie</a></li> </ul> </li> <li class="sousmenu plop"><a href="">La Structure</a> <ul class="niveau2"> <li class="sousmenu"><a href="">Première partie </a> <ul class="niveau3"> <li><a href="c0.html">Prologue</a></li> <li><a href="c1.html">Chapitre 1</a></li> <li><a href="c2.html">Chapitre 2</a></li> <li><a href="c3.html">Chapitre 3</a></li> <li><a href="c4.html">Chapitre 4</a></li> <li><a href="c5.html">Chapitre 5</a></li> <li><a href="c6.html">Chapitre 6</a></li> </ul> </li> <li class="sousmenu"><a href="">Deuxième partie</a> <ul class="niveau3"> <li><a href="c7.html">Chapitre 7</a></li> <li><a href="c8.html">Chapitre 8</a></li> <li><a href="c9.html">Chapitre 9</a></li> <li><a href="c10.html">Chapitre 10</a></li> </ul> </li> </ul> </li> <li class="sousmenu plop"><a href="">Le Contenu</a> <ul class="niveau2"> <li><a href="personnages.html">Personnages</a></li> <li><a href="genealogie.html">Généalogie</a></li> <li><a href="extraits.html">Extraits</a></li> </ul> </li> <li class="sousmenu plop"><a href="">Les Auditions</a> <ul class="niveau2"> <li><a href="informations.html">Informations</a></li> <li><a href="etablissements.html">Etablissements concernés</a></li> <li><a href="planning.html">Planning</a></li> <li><a href="documents.html">Documents</a></li> <li><a href="roles.html">Exemples de rôles</a></li> </ul> </li> <li class="sousmenu plop"><a href="">Au jour le jour</a> <ul class="niveau2"> <li><a href="calendrier.html">Calendrier</a></li> <li><a href="6juin.html">Lecture 6 juin</a></li> <li><a href="excalibur.html">Excalibur</a></li> </ul> </li> <li class="sousmenu plop"><a href="">Documentation</a> <ul class="niveau2"> <li><a href="bretagne.html">"Matière de Bretagne"</a></li> <li><a href="textes.html">Textes</a></li> <li><a href="poemes.html">Poèmes</a></li> </ul> </li> </ul> </div> <br> <br></body> </html>
J'ai ajouté un </body> et un </html> à la fin...
Autre chose dont je ne suis pas sûr, pour mettre deux class à un élément, ce n'est pas comme ceci:
sousmenu , plop
mais
sousmenu plop
Séparés par des espaces si mes souvenirs sont bons.
Essayez de faire avec ces modifications, on avisera ensuite.
