18043 sujets

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

[résolu]Mon menu ne s'affiche pas sous IE

Bonjour la communauté,

Je poste ici pour vous faire part d'un petit problème. Je suis en train de faire un site pour mon équipe de foot us le design est en place mais le menu n'apparait pas pas sous internet explorer mais très bien sous firefox pouvez-vous me dire pourquoi ?

Page test : http://ravejump.free.fr

Configurations : IE 6 et Windows XP

Mon 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="fr" lang="fr">
<head>
<TITLE>Pendragons (95) : Le site des Pendragons de Bouffémont - Accueil</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
<META NAME="TITLE" CONTENT="Pendragons | Le site des Pendragons de Bouffémont ">
<META NAME="AUTHOR" CONTENT="Jeff">
<META NAME="OWNER" CONTENT="Knuckles_chaos95@free.fr">
<META NAME="SUBJECT" CONTENT="pendragons">
<META NAME="RATING" CONTENT="foot us">
<META NAME="DESCRIPTION" CONTENT="Site web des Pendragons de bouffémont, foot us, équipé, flag.">
<META NAME="ABSTRACT" CONTENT="Site web des Pendragons de bouffémont, foot us, équipé, flag.">
<META NAME="KEYWORDS" CONTENT="pendragons, bouffemont, football americain, foot us, barnett">
<META NAME="REVISIT-AFTER" CONTENT="14 DAYS">
<META NAME="LANGUAGE" CONTENT="FR, FR-BE, FR-CH">
<META NAME="ROBOTS" CONTENT="All">
<META NAME="AUTHOR" CONTENT="Kchaos">
<META NAME="COPYRIGHT" CONTENT="Pendragons">
<META NAME="IDENTIFIER-URL" CONTENT="http://">
<center>
<link rel="stylesheet" media="screen" type="text/css" title="css" href="style.css" /> 
</head>

<body>
<div id="design">
<div id="header">
</div>
<div id="sous_header">
</div>
<!--début menu//-->
	  <div id="menu">	
<p align="left"><img src="images/menu_infos.jpg"></p>
<p align="left"><a href="">- Foot US</a></p>
<p align="left"><a href="">- Règles</a></p>
<p align="left"><a href="">- Equipement</a></p>
<p align="left"><a href="">- Entrainement</a></p>
<p align="left"><img src="images/menu_calendrier.jpg"></p> 
<p align="left"><a href="">- Calendrier Senior</a></p>
<p align="left"><a href="">- Calendrier Junior</a></p>
<p align="left"><img src="images/menu_divers.jpg"></p> 
<p align="left"><a href="">- Photos</a></p>
<p align="left"><img src="images/menu_aff.jpg"></p> 
<p align="left"><a href="">- Site 1</a></p>
<p align="left"><a href="">- Site 2</a></p>
<p align="left"><a href="">- Site 3</a></p>
<p align="left"><a href="">- Site 4</a></p>

</div>
<!--fin menu//-->

<!--début contenu//-->	  
	  <div id="content">
	  	  <p align="center"><img src="images/tableau_senior.jpg">&nbsp;&nbsp;&nbsp;<img src="images/tableau_junior.jpg">&nbsp;&nbsp;&nbsp;<img src="images/tableau_flag.jpg"></p> 
	  <p align="left">&nbsp;&nbsp;&nbsp;<img src="images/news_content.jpg"></p> 
<!--Début du module de news -->
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>

<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>

<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>

<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</br>

<!--Fin du module de news -->
</div>
<!--fin contenu//-->	  
<div id="footer">
</div>
	  

</body>
</html>


Mon code css :

/*
Design pour Pendragons web
Réalisé par Kchaos
 http://ravejump.free.fr
 
*/
body{
	background-color: #000000;
	background-position : top center;
	background-repeat: repeat;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: normal;
	color: #ffffff;
	margin : 0;
	padding : 0;
}
#header {
width: 770px;
height: 180px;
left: 0;
right: 0;
top: 0px;
background-image : url("images/header.jpg");
}
#sous_header {
width: 770px;
height: 25px;
left: 0;
right: 0;
top: 0px;
background-image : url("images/sous_header.jpg");
}
#design{
position: relative;
	width:770px;
	margin : auto;
	margin-top : 0px;
	margin-bottom : 0px;
	padding-left : 0px;
	padding-right : 0px;
	background-image : url("images/corps.jpg");
    background-position : top center;
	background-repeat: repeat-y;
}
#content {
margin-left: 150px;
margin-right: 10px !important;
float: right !important;
float: right;
width: 550px !important;
width: 550px;
background-color:none;
font-size: 10px;
}
#menu {
position: absolute;
left:0;
margin-left: 14px;
margin-left: 14px !important;
width: 140px;
width: 150px !important;
height: 450px;
text-align: left;
}
#footer {
	clear: both;
	background-image: url("images/footer.jpg");
	width: 770px;
	height: 50px;
	padding: 0px;
    margin: 0px;}

#menu a {
	padding: 0;
	margin: 0px 0px 0px 0px;
	color: #ffffff;
	text-decoration: none;
	font-weight: bold;
	padding: 0px 0px 0px 0px;
	background-repeat: no-repeat;
}

#menu a:hover{
	padding: 0;
	margin: 0px 0px 0px 0px;
	color: #B7662E;
	font-weight: bold;
	text-decoration: underline;
	}

#menu ul {
	padding: 0;
	margin: 0px 0px 5px 0px;
	list-style: none;
}

.texte {
	FONT-SIZE: 10px; COLOR: #ffffff; FONT-FAMILY: Verdana; padding: 50px;

}

td{
	FONT-SIZE: 10px; COLOR: #ffffff; FONT-FAMILY: Verdana
}
br{
	FONT-SIZE: 10px; COLOR: #ffffff; FONT-FAMILY: Verdana
}

Modifié par Knuckojeff (03 Feb 2008 - 16:11)
hello

je pense qu'il faudrait peut être déja commencer par réorganiser ton code, au niveau du html mais aussi de la feuille de style. Passe le tout au validateur w3c et corrige ton code..

Pour ton souci de menu qui disparait, je crois que c'est lié à la position absolue de ta div menu. Sinon tu défini deux fois la largeur de celle çi, avec un !important sur la deuxième, une fois devrait suffire Smiley smile
Pense aussi à passer tes balises html en minuscule..

Et puis les attributs alt et title sur les images et liens..
Un gros tour sur ce site devrait te permettre de remedier à tout ça Smiley cligne
Modifié par audrasjb (03 Feb 2008 - 15:20)
Sujet clos
Aller à