div en bas d'un autre

Répondre


Cette question est un moyen d’empêcher des soumissions automatisées de formulaires par des robots.
Smileys
:D :) :( :o :shock: :? 8-) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: =D> #-o =P~ :^o :non: :priere: 8-|
Voir plus de smileys
  Revue du sujet
 

  Étendre la vue Revue du sujet : div en bas d'un autre

Re: div en bas d'un autre

par miiidooo19 » 03 avr. 2012, 09:13

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?

Re: div en bas d'un autre

par bsharpen » 19 mars 2012, 15:52

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+ :)

div en bas d'un autre

par miiidooo19 » 18 mars 2012, 16:01

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>