Le pied de page de descend pas Résolu/Fermé

Question

Bonjour, 

J'ai un petit soucis, je vais créer des carrés pour chaque "article" mais quand j'en ajoute les carrés ne descendent pas :

http://imageshack.us/photo/my-images/813/footerc.jpg/


Voici le css :


div.carre{
position:relative;
border-width:2px;
width:300px;
height:300px;
margin-left:10px;
margin-bottom:10px;
border-style:outset;
float:left;
text-align:justify;
padding-left:3px;
padding-right:3px;
}

#footer {
	height:17px;
	color:#555; 
	font-size:0.7em; 
	background-color:#e2e1df; 
	padding-top:6px;
	margin:0; 
	margin-left:00px; 
}

En enlevant le float ou en le mettant en top ou bottom, les carrés s'ajoutent à la suite verticalement et le pied de page descend bien en même temps.

Auriez-vous une solution à mon problème pour que ce soit comme sur la photo mais avec le pied de page en dessous de tout?

Merci par avance

Configuration: Windows 7 / Chrome

rescue · Answer

Bonjour,

Je n'ai pas testé mais une idée vite fait :
Dans footer tu ajoutes

clear: both; 

@+

rescue · Answer

Re,

Oui mais c'est pas comme ça que tu vas trouver, il faut connaitre un peu le css.

Je ne mettrais pas un élément flottant en position relative.

float permet de sortir un élément du flux, en cela on peut préciser que l'élément est ciblé, par exemple une image ou une colonne de contenu, s'affiche à gauche ou à droite.

@+

avion-f16 · Answer

Salut, « clear: both; » est bien la solution. Sauf qu'il ne faut pas appliquer cette propriété sur la

représentant le footer, mais insérer une div vide avant. Par exemple (en HTML5 :-) ) :

Le pied de page de descend pas

3 réponses

Discussions similaires