Page 1 sur 1

div en bas d'un autre

Posté : 18 mars 2012, 16:01
par miiidooo19
bonjour

j'ai un problème avec css j'ai un div page (qui contient 3 div menu,contenu et espacePub) et un autre div footer

comme faire pour que ce dernière soit toujours en bas de div page quelque soit le height de l'un des 3 div qui composent div page

Code : Tout sélectionner

#header { margin:auto; width:925px; height:150px; background-color:red; padding:0px 0px 30px 0px; } #page { margin:auto; width:1200px; height:500px; background-color:#159753; } #menu { float:left; width:205px; height:400px; background-color:#111999; } #contenu { float:left; background-color:green; width:800px; height:400px; padding-left:15px; } #espacePub { float:left; background-color:#852654; width:180px; height:auto; } #footer{ margin:auto; width :975px; height:auto; background-color:#369741; }
<!DOCTYPE html>
<html>
	<head>
		<title>structure de mes pages</title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<link rel="stylesheet" href="style.css" type="text/css" charset="utf-8" />
	</head>
	<body>
		<div id="header">
		
		</div>
		
		<div id="page">
			<div id="menu">
				ici menu<br/>
				ici menu<br/>
				ici menu<br/>
				ici menu<br/>
				ici menu<br/>
			</div>
			<div id="contenu">
				ici contenu<br/>
				ici contenu<br/>
				ici contenu<br/>
				ici contenu<br/>
				ici contenu<br/>
				ici contenu<br/>
			</div>
			<div id="espacePub">
				ici espacePub<br/>
				ici espacePub<br/>
				ici espacePub<br/>
				ici espacePub<br/>
			</div>
		</div>
		
		<div id="footer">
			ici footer<br/>
			ici footer<br/>
			ici footer<br/>
		</div>
	</body>
</html>

Re: div en bas d'un autre

Posté : 19 mars 2012, 15:52
par bsharpen
salut , plusieurs solutions pour ces problèmes de flottant

1)"clearfix" sous google tu trouveras des infos à ce sujet.

2)tu peux ajouter un markup après ton div page :
<br style="clear:left"/>
(pb de sémantique ...)

3)ou ajouter dans le css du footer un
clear:left
les deux derniers ne fonctionneront pas (ou très mal) sous les nav anciens,ie en particulier, pb de haslayout.

Si l' envie te prend d'aligner tes blocs en fonction de la hauteur excessive d'un bloc, google le concept de faux-column ou explore des solutions comme "les frameworks Css" qui sont pour certains un gain de temps appreciable et performant.

voila a+ :)

Re: div en bas d'un autre

Posté : 03 avr. 2012, 09:13
par miiidooo19
merci pour votre réponse :)
j'ai utiliser clear: left et ça marche comme je veux
mais comment puis-je dépasser les pb avec les anciens navigateur?