18041 sujets

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

Problème avec le Doctype [résolu]

Bonjour à tous,

je suis nouveau ici mais avant de rentrer dans le vif du sujet je voulais remercier toute l'équipe d'alsacréation Smiley cligne

ce site m'a apporté énormément et je vous en suis extrèmement reconnaissant.

Voilà mon problème (sûrement pas grand chose mais je ne trouve pas) :

je créé actuellement un site qui s'affichait correctement. Voulant le mettre aux normes, j'ai ajouter le doctype (j'ai essayé le strict et kle transitionnel : même résultat) et depuis mon menu se colle tout en haut alors qu'avant il était sous la bannière.

je vois un peu d'où vient le problème (bannière en position relative) mais je ne sais pas comment le résoudre (en effet je ne sais pas centrer en position absolue)

voici les codes :

le 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>L'Oreille du Coin</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-15" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Language" content="fr" />
</head>
<body>
<div id="conteneur">

	  <div id="header">	 
	  <div id="menu">
	  	
<?php
include("menu.php");
?>
	  </div></div>


le css :


/* CSS issu des tutoriels css.alsacreations.com */ [cligne] 
body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
}

#header {
position: relative;

   width: 800px;
   height: 160px;
   background-image: url("img/bandeau.jpg");
   background-repeat: no-repeat;
   margin:auto;
   border:1px solid yellow;

}

#conteneur {
position: absolute;
width: 99%;
text-align:center;
margin:auto;
border:1px solid red;
}

#menu {
position: absolute;
top:130;
left:10;
width:100%;
z-index:40;
}


merci et désolé si j'ai fait une erreur grossière Smiley confus
Modifié par chessjc (20 Mar 2007 - 10:20)
Bonjour et bienvenue à toi!
Ton problème est issu d'une différence de permissivité entre le mode
quirks (sans doctype, doctype antèrieurs aux HTML4.0 et doctype html 4 transionnal sans URI) et le mode standard (doctypes récents)
En effet le mode quirks accepte les valeurs de positionnement sans unité
au contraire du mode standard:

Tu dois donc ajouter les pixels :
#menu {
top:130px;
left:10px;
...
}

Modifié par Hermann (17 Mar 2007 - 19:04)
Sujet clos
Aller à