28220 sujets

CSS et mise en forme, CSS3

Salut à tous,

Voilà j'ai lu pas mal de doc surtout sur ce forum sur comment mettre le pied de page dans le fond à tous les coups et j'ai essayé de l'implémenter.

Et ca marche ... presque Smiley decu

Sous Firefox mon "footer" reste au milieu du texte quand celui-ci
dépasse le milieu de page et malheureusement (je râle pour ca) IE
l'affiche bien comme je le souhaite.

Je ne vois pas où dans le css je dois changer quelque chose. Quelqu'un
voit-il où est le problème ?

Voici le lien : http://www.ramses-services.be/testcss/test.html

Merci
essaie ça dans ton css pour ton texte:

overflow: auto;
Modifié par Dais (22 Mar 2005 - 15:27)
Bonjour,
Essayes d'enlever le positionnement absolu de ton footer, ton contenu est suffisant important pour "coller" ton footer au bas de ta page.
Tu as mal appliqué les conseils donnés ci-dessus, qui permettent de résoudre ton problème. Il faut :
- supprimer le positionnement absolu du #footer, effectivement inutile (et qui neutralise un éventuel clear:both).
- appliquer clear:both à #footer.
- accessoirement, supprimer le clear:both de #content, inutile.

Ce qui donne:

#footer {
	clear: both;
	text-align: center;
	font-size: 10px;
	background: #FFF url(bg_foote.jpg) top left repeat-x;
	width: 100%;
}
Merci Laurent Denis (je sais pas c'est lequel le prénom Smiley cligne )

Malheureusement ca ne fait pas tout à fait ce que je cherche.

Je vais tenter d'expliquer :

J'ai des pages pour lesquelles j'ai un texte qui dépasse un écransans problème et donc à priori je n'ai pas de problème de footer puisqu'il se retrouve bien dans le fond.
Mais j'ai aussi des pages qui ne remplisse pas un écran entier mais j'aimerais que malgré tout le "footer" se retrouve bien en bas.

Bref avec un même code CSS j'aimerais avoir à coup sur le footer en bas de l'écran et plus de blanc après.

Merci si vous avez une idée...
Tu voudrais à la fois, sous le même code CSS :
- un footer en flux (pour les pages longues)
- le même footer en position absolue (pour les pages courtes)

Le beurre ou l'argent du beurre... Hélas, il faut choisir l'un ou l'autre Smiley cligne
En fait, j'ai trouvé cet article et quand je regarde son exemple, il fonctionne exactement comme je le voudrais. En redimentionnant la fenêtre tu vois que le header reste en bas (scroll) et quand l'écran est plus grand (ex: F11 dans le browser) le footer reste dans le fond de l'écran.

Voici l'article : http://www.solardreamstudios.com/learn/css/footerstick/

Bref j'essaie d'implémenter sa solution dans mon site mais j'ai juste le petit truc qui coince... Smiley confus
La technique est intéressante, en effet.

Mais personnellement, j'attendrai la sortie d'IE7 pour recourir à height/min-height et aux hacks nécessités par IE5.x et IE6.0 : il y a là une combinaison de bugs et de hacks qui laisse trop d'incertitude sur ce qui se passera si Microsoft corrige l'un ou l'autre de ses implémentations ou de ses bugs...

D'autre part, je serais curieux de connaître le résultat sur les navigateurs Mac et sous Konqueror ? Quelqu'un se dévoue pour faire le point ?

Sinon, un détail en passant : le hack du @import"/css/styles.css"; utilisé par l'auteur sur son site est également intéressant, dans la mesure où il semble bien s'agir d'une syntaxe parfaitement valide. Reste à déterminer sa pérennité ? A creuser.
Modifié par Laurent Denis (24 Mar 2005 - 08:00)
Laurent Denis a écrit :
La technique est intéressante, en effet.

Mais personnellement, j'attendrai la sortie d'IE7 pour recourir à height/min-height et aux hacks nécessités par IE5.x et IE6.0 : il y a là une combinaison de bugs et de hacks qui laisse trop d'incertitude sur ce qui se passera si Microsoft corrige l'un ou l'autre de ses implémentations ou de ses bugs...

D'autre part, je serais curieux de connaître le résultat sur les navigateurs Mac et sous Konqueror ? Quelqu'un se dévoue pour faire le point ?


Le pire c'est que le code que j'ai implémenter jusque là fonctionne très bien avec IE6 mais pas avec FireFox
Smiley decu