28172 sujets

CSS et mise en forme, CSS3

Bonjour,

La refonte du site pour notre société est en cours mais je rencontre un problème sur le positionnement de mon footer.

http://www.meslin-batiment.com/new/index.php

Je souhaite que celui-ci se positionne automatiquement sous mon conteneur en fonction de la hauteur de page. Il est en display:block et position relative mais il se place sous mon header.

Mon menu et mon conteneur sont eux en position "absolute"

Comment faire ?

Merci de votre aide, n'hésitez pas s'il manque des infos.
Modifié par Freemuse (28 Oct 2013 - 08:27)
Bonjour Freemuse,

Quand je regarde la page, je ne vois pas du tout le footer. Tu es sur qu'il se met juste en dessous du header ?
Sinon, essaye de mettre le footer en position "absolute", même si je ne suis pas sur du résultat.
Je suis d'accord avec Raphi.
Il faut reprendre toutes les positions des différentes parties, sinon, ça va être l'enfer.
OK, merci a tous pour votre aide, sympa de voir un forum qui bouge.

Je vais reprendre tout ça et reviens vers vous pour vous tenir au jus !

Bonne continuation.
Je capitule !!!

Malheureusement mon niveau ne me permet pas de trouver la solution. J'opte pour la solution de faciliter en vous laissant le code html et css de mon index.

http://meslin-batiment.com/new/html.txt
http://meslin-batiment.com/new/css.txt

Ma div "pied" se situe sous ma barre de menu et le footer, vous l’apercevez : c'est la bande rouge qui se place devant le carousel.

Seul ma barre de navigation "nav" reste en poistion "absolute", tous les autres div sont en position "relative">> Je ne trouve pas la solution pour que la div "pied" et le "footer" se mettent en dessous de mon conteneur.

Merci d'avance pour votre aide.
Salut

Je ne vois pas ton problème, ton footer apparaît bien en dessous avec FF, il y a "juste" l'image de ton bas de feuille qui n'apparaît pas parce que le lien vers l'image qui le compose commence par "/ et pas à mon avis "../ donc ça fait un rectangle rouge...

Bon, si tu testes sur IE, n'ayant qu'un IE 7 à dispo au bureau, je ne vois pas du tout ton site, enfin si, mais c'est une catastrophe dans ce cas donc je ne peux pas essayer de t'éclairer.
Salut Bob,

Merci a toi pour les infos. En faît, tu n'as pas vu les problèmes dont je parlais car j'ai retravaillé sur le site entre deux.

Pour la compatibilité avec IE7, j'utilise "l'overrides" sous chrome pour voir s'il y a des erreurs, et en apparence... ça fonctionne ! >> Cet outil n'est peut-être pas fiable ?

Bonne soirée
Bonjour freemuse.

Il y a des choses qui ne vont pas très bien dans ton code html et css.

Pour répondre à ta question, il s'agit d'un problème classique du positionnement du footer par rapport à un conteneur qui ne prend pas la totalité de la hauteur de la page.
Tu désires que le footer soit positionné en bas de la page si le conteneur est plus grand que la fenêtre (d(où l'apparition de l’ascenseur).
Mais si le conteneur est plus petit, le footer doit se positionner en bas de la fenêtre.

Voici un exemple de ce que l'on peut faire sans utiliser les "display:absolute". Il suffit de faire varier le contenu de <section> pour observer le comportement du footer.

Tu utilises des images pour créer un cadre centrale. Comment se fait-il que la largeur de "conteneur_bas.png" (1034X50) ne soit pas la même pour "fond_conteneur.png" (1024X1) ni celle de "separate.png" (961X29) ?
Le mieux serait de donner la même taille de 1034px pour tes trois images !

Pour le menu central qui doit suivre la scroll bar, je trouve que le code (du jquery) mis en place est bien trop compliqué !

@+