Pied de page mobile

Bonjour à tous !
Voici un lien vers la page sur laquelle je travaille actuellement : http://www.dacquin.fr/ZITE/
Ayant fait un système de 2 colonnes avec FLOAT dans la page (il me semble que c'est la cause du problème), le pieds de page ne tient pas compte de la hauteur du contenu de la page. En fait c'est mon "contenant" que j'ai appelé "#page" qui ne tient pas compte de son contenu qui est réalisé avec les 2 colonnes flottantes.
Je ne sais pas si je me fais bien comprendre, mais je sèche pour décoincer tout ça.
Merci pour votre aide.
Modifié par bmael (07 Sep 2007 - 18:22)

Finalement, j'ai mis le contenu de la page dans un tableau avec 2 colonnes. Il n'y a donc plus de DIV avec FLOAT. Le problème vient d'ailleurs. Si on réduit la taille de la fenêtre, le pied de page suit la fenêtre et passe par-dessus le texte.
Voici la feuille de style : http://www.dacquin.fr/style.css
J'ai essayé beaucoup de chose, mais je ne vois pas ce qui fait que le pied de page est attaché au bas de la fenêtre.
Précision : je travaille sur mac. Ca foire pareil sur Firefox et Safari 3 beta. Ca marche bien sur Opera 9. Je n'ai pas encore essayé sur IE 6 ou 7.

Bonjour,

Ton Doctype est erroné et donc les navigateurs interprètent ta page en mode Quirks (chacun fait ça à sa sauce...), ce qui n'est pas une bonne chose.

Peut-être faudrait-il commencer par corriger ça, ainsi que les éventuelles erreurs de validation HTML?

En passant, tu as placé ton menu dans un titre de section de niveau 1 (h1), ce qui est assez surprenant. De plus, les images du menu ont pour texte alternatif "[PNG] bouton-machin" au lieu de juste "machin". Il y a une raison particulière pour cela? Je ne suis pas sûr que ça serve tes visiteurs que d'avoir l'information "[PNG] bouton-" s'ils ne peuvent pas voir l'image...

Toujours en passant: un petit tableau pour ta structure en deux colonnes c'est très bien (on peut faire sans, mais si pour toi c'est plus simple/plus gérable, pourquoi pas). Par contre, un tableau à deux colonnes ça fait deux cellules de tableau, pas trois. Tu as donc une cellule inutile. Note: on peut faire un écart entre deux cellules en utilisant un peu de padding sur l'une des deux cellules.

Heu... à la réflexion, il faudrait revoir toute ta structure HTML. La structure principale est semble-t-il correcte, mais niveau contenu c'est assez catastrophique:
- balises <font> (en partie mal fermées?);
- des <h1></h1> et <h2></h2> sans contenu;
- des flots de texte dans des <h4> ou <h5> au lieu d'être dans de simples paragraphes...

J'ai comme l'impression que tu n'as pas compris quel était le rôle des titres de section (hN) dans un document web. Une petite révision ne ferait pas de mal.

Enfin, un conseil: renforce la couleur de ton texte. Gris moyen-clair sur fond blanc, c'est très peu lisible, même sans reflet dans le dos, léger problème de vue, etc.

Super ! Merci pour ton aide. Ca commence à prendre forme. En fait, j'utilise ZITE CMS pour faire ce site. Donc les histoires de PNG, c'est un truc automatique. Mais tu as raison, il faut que je le corrige.
En effet, je vais faire du ménage dans le HTML, mais j'en suis au calage.
J'utilise des balise h4 et h5 parce qu'elles étaient dans la feuille de style que j'ai modifié. J'ai eu la flême de me créer de nouvelles class. Le principal c'est que ça marche.

Merci beaucoup pour le DOCUTYPE, je n'avais pas vu. Ca règle un certain nombre de petits problèmes de décalage suivant le navigateur.

Je crois qu'il n'en reste plus qu'un : sur Safari 3 beta, le fond et le contenu ne se déplacent pas ensemble. Ce qui fait que dans une petite fenêtre, le contenu est décalé à gauche du fond blanc.

Ca y est ! C'est tout bon. Le problème de décalage sur une petite fenêtre de Safari venait du fait qu'un bloc du CMS ZITE, à droite, que j'avais caché (visibility: hidden), n'était pas en position: absolute, donc sur Safari, ça décalait lorsque je réduisais la fenêtre.
Florent, merci pour tes lumières, j'espère que ce post pourra servir à quelqu'un d'autre.
J'ai essayé de faire un peu de ménage dans le code HTML.