Version complète: sur le forum Webmaster Hub : Défi : placer une bande horizontale en bas de page
Webmaster Hub > Création et exploitation de Sites Internet > Les langages du Net > (X)HTML et CSS
kazes
Bonjour à tous,

cela fait (vraiment) beaucoup de sites et de forums que je parcours pour résoudre mon problème, en vain. IMSTP6.gif

Je m'explique :

je souhaite placer une bande horizontale qui touche le bas du navigateur, quel que soit le contenu de la page avec ces conditions:

- il faudrait que cette bande soit par dessus le conteneur et non "à la suite".
- ce serait bien qu'elle touche le bas du navigateur même quand le contenu ne la pousse pas en bas.

bref, toujours collé en bas mais pas fixé. Un dessin vaut mieux qu'un long discours dans mon cas :

j'ai réussi à obtenir l'effet sous IE 6 mais pas sous FireFox, regardez donc cette page de test sous IE 6, c'est exactement ce que je souhaite mais pour le Renard de Feu aussi tongue.gif

test (le css est présent dans le code de la page)

Merci wink.gif
Régis
CITATION(kazes @ mercredi 23 mars 2005, 14h31)
je souhaite placer une bande horizontale qui touche le bas du navigateur, quel que soit le contenu de la page avec ces conditions (...)

Bonjour "kazes" et bienvenue sur Webmaster-HUB,

A mon avis, tu as de fortes chances de trouver ta solution, ici : Les pieds (de page) dans le plat
MarvinLeRouge
Salut,

position:fixed et le hack qui permet de le faire marcher sous IE sont tes amis.
baycris
CITATION(MarvinLeRouge @ mercredi 23 mars 2005, 18h17)
Salut,

position:fixed et le hack qui permet de le faire marcher sous IE sont tes amis.
*



euh j'ai pas compris... Peus tu expliquer ?
Merci
sorry Cris
kazes
CITATION(Régis @ mercredi 23 mars 2005, 14h54)
Bonjour "kazes" et bienvenue sur Webmaster-HUB,

A mon avis, tu as de fortes chances de trouver ta solution, ici : Les pieds (de page) dans le plat
*



Merci, j'ai déjà fait ce tutoriel mais je veux bien le relire parce que c'est pas possible, faut que je trouve :nono:

c'est (re)parti ^_^
kazes
Ce tutoriel : Les pieds (de page) dans le plat n'est pas à remettre en cause. Comme promis, je l'ai refait sagement, avec des blocs de couleurs puis j'ai intégré petit à petit mon interface. Je me suis dit : y'a pas de raisons ! blink.gif

Tout allait bien jusqu'à ce que je remplace mon contenu bidon (du texte en l'occurence) par celui extrait de ma base de données (BDD). Et là, c'est le drame : décalage de mon pied de page (la haie) à quelques centaines de pixels du bas :nono: , encore ...


Je me suis dit qu'une balise extraite du contenu de ma BDD posait problème, peut-être une balise de lien ? un div ? Par élimination j'ai découvert que c'était l'absence des attributs width et height dans la balise img qui causait le bug sous FireFox. IMSTP3.gif

Je n'avait pas précisé les dimensions des images car, issues d'un contenu dynamique, elles n'ont pas toutes la même taille. J'ai ajouté 2 lignes de php pour récupérer ces valeurs et le problème était réglé ! IMSTP2.gif

C'est vrai que lorsque l'on y réfléchit, on se rend compte que FireFox interprète le HTML, affiche la page selon ce qu'il sait. Il affiche ma haie mais ne connaissant pas la taille des images, la hauteur de la page a été mal calculée. Maintenant qu'il connait la taille de chaque image, il peut positionner la haie sans problème.

Merci à ceux qui se sont penchés sur mon problème ! ^_^

(bon, bah j'suis pas mécontent d'en avoir fini avec cette galère ! biggrin.gif )
Monique
Bonjour,
CITATION(kazes @ lundi 28 mars 2005, 20h25)
(bon, bah j'suis pas mécontent d'en avoir fini avec cette galère !  biggrin.gif  )
*

Bravo pour ta tenacité et la rigueur avec laquelle tu as traité le problème... et plus encore, merci d'avoir partagé la solution :up:

Un autre avantage d'indiquer les dimensions des images, c'est d'éviter le déplacement du texte (qui s'affiche le premier) quand les images viennent prendre leur place.
Régis
CITATION(Régis @ mercredi 23 mars 2005, 15h54)
A mon avis, tu as de fortes chances de trouver ta solution, ici : Les pieds (de page) dans le plat

Salut "kazes",
Bien content que cette URL t'a été utile.
Et bravo, pour ta tenacité.. IMSTP3.gif
Ceci est une version "bas débit" de notre forum. Pour voir la version complète avec plus d'information, la mise en page et les images, veuillez cliquer ici.