[CSS] Probleme avec une boite dans une boite

Seth77

20 Jul 2006 à 17:23

Salut

voici mon code HTMl :

Code :


<!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></title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
<link href="main2.css" rel="stylesheet" type="text/css" /> 
</head> 
<body> 
<div id="conteneur"> 
<div id="header"> </div> 
</div> 
</body> 
</html>

le css :

Code :


body { 
margin: 0; 
margin-top:10px; 
padding: 0; 
font-family:Verdana, Arial, Helvetica, sans-serif; 
font-size: 0.8em; 
background-color: #fff; 
} 

#conteneur { 
width: 970px; 
margin-left: auto; 
margin-right: auto; 
background-color: #99C00C; 
height:500px; 
} 

#header { 
position:absolute; 
top:50px; 
left:100px; 
width:50px; 
height:50px; 
background-color: #99CCCC; }

Pourquoi la boite header ne bouge pas avec l'autre ?

thx @+

Otto Didact

20 Jul 2006 à 18:47

Bonjour.

Ton header est en position absolue donc il sort du flux normal.
Met ton conteneur en position relative, et supprime le positionnement absolu de ton header et ça devrait aller.


margin-left: auto; 
margin-right: auto;

Tu peux remplacer par

margin: 0 auto;

Amicalement
Modifié par Otto Didact (20 Jul 2006 - 18:51)

CSS et mise en forme, CSS3

[CSS] Probleme avec une boite dans une boite