28173 sujets

CSS et mise en forme, CSS3

[Résolu]Div positionnée en bas de page

Bonjour,

j'aimerais positioner une div en bas de page, quelque soit la résolution mais je ne sais pas trop comment m'y prendre. J'ai déjà essayé quelques trucs sans succès.


body{
	width: 760px;
	background: url(../design/fond.gif);       
 	min-height: 100%;
	height: auto!important;               
	height: 100%;                                   
	margin: 0 auto;	
	padding: 0;
	text-align: left; /*rétablit l'alignement normal pour IE*/		
}

#tete{
	background: url(../design/maison.gif);	
	background-repeat: no-repeat;
	height: 181px;	
	margin: 0;
}

#contenu{
	position: relative;
	width: 650px;
	margin: 0 auto;  
  padding: 0;
 
}

ça existe pas le float vertical? float-bottom ça sonne bien non ?! Smiley cligne
malheureusement pour moi, le gabarit qui aurait été susceptible de m'aider (http://css.alsacreations.com/modeles/modele12.htm) n'a pas de footer défini.. (oubli ???).. si quelqu'un a une piste........
Modifié par p_tite_jo (26 Jan 2006 - 23:17)
Modérateur
bonjour,
FAQ a écrit :
Mais ne fonctionne pas correctement si le contenu est plus long que la page.

Smiley confused desolé de contredire la faq, mais cela fonctionne avec un contenu plus long que la page, d'ailleurs pour l'exemple, le pied est positionné dans une page de 1500 pixel de haut en absolute dans un conteneur en relative : Placer un element au bas d'un autre elements, ... et aussi au bas de la page au delà du bas de l'ecran ou de la fenêter du navigateur Smiley smile .
et pour eviter que l'element positionner en absolute au bas de la page ne vienne se superposer au dessus du contenu, on ajoute en fin de flux (dans le conteneur concerné) un div egale a la hauteur du footer. ce div supplementaire (comme je le fais) est en fait une "marge" vide qui ne soufrira pas d'etre recouverte par l'element positionné en absolute lorsque le contenu depasse la hauteur de la fenetre du navigateur.

Apres avoir passer un temps a economiser une balise (div) comme "conteneur principal" et a appliquer le css directement a "body", j'ai changer de methode car cette simple balise supplementaire en temps que conteneur principal economise pas mal de bugs d'interpretation du css (appliquer a body ou au element prenant "body" directement en reference comme parent direct selon les navigateurs) . et en appliquant la regle en reference a un conteneur pour le footer plutot que pour body, cela fonctionne.
Les "navigateurs" evoluant de mise a jour en mise a jour, et les plus vieux disparaisant avec les machines qui les exploite encore, je ne me fait pas trop de soucis au niveau des qualité "multi-navigateur de cette methode".
Pour les navigateurs "sans css" il suffira de laisser le "footer" a sa "place" dans le code "html".

respectueusement Gcyrillus


a plus
Merci pour ces infos...
En effet, j'ai pas consulté la FAQ.. ça ne fait pas encore partie de mes reflexes mais je vais y travailler !
@ +
Sujet clos
Aller à