[RESOLU] Footer... Quand ça veut pas, ça veut pas !

Bonjour à tous !
Voilà, j'ai un problème vraiment très très pénible !

J'ai une page (composée d'un certains nombre d'éléments comme vous allez le voir...), faites en gros comme ceci :
- Le haut : un bandeau très fin, un deuxième bandeau (avec logo, etc), un troisième bandeau de titre, un bandeau "megabannière" où apparait une bannière de pub (ah... la pub... ) et enfin un menu.
- Ensuite, la page, composée elle de trois parties (grosso-modo) : une fiche, à gauche, une carte, à sa droite et enfin des publicités (oui encore, oui...) à droite de la carte. Fiche + carte + pubs...
- Enfin, en tout cas j'aimerais, d'un footer, qui rappelle le menu et le premier bandeau du haut...

Le souci, c'est que le footer ne veut pas se coller en bas ! Sous IE, il apparait à droite sous forme d'un carré, et sous Firefox il apparait derrière la carte...
J'ai essayé ce qui est mentionné dans la FAQ ("coller un footer en bas de page", je suis allé voir sur pompage, j'ai essayé de me dépatouiller avec leur CSS... Rien à faire, ça ne veut pas marcher, et je ne comprends pas pourquoi...).
Certes, j'utilise peut-être un peu trop de float dans ma page, mais je ne vois pas en quoi ça poserait un problème...
Malgré le nombre de DIV, la page reste assez simpliste je pense...

Voici le code utilisé... Si vous avez le courage de le lire .

Le HTML (je sais que ça peut paraître confus et bourrin, mais tout n'a pas été pensé dès le départ... hélas) :

<div id="head"></div>
<div id="bandeau"></div>

<div id="bandeau_titre">
blabla...
</div>

<div id="megabanniere" align="center"></div>

<div id="menug">
<div id="menu2">
blabla
	</div>
	<div id="help">Besoin d'aide ? <a href="carte.php">Cliquez ici</a></div>
	</p>
</div>

<div id="fiche">
</div>

<div id="carte">
	<div id="map"></div>
	<div id="map2"></div>
</div>
<div id="pub">
pubs...
</div>

<div id="menug2">
<div id="menu2">
blabla...
  </div>
  <div id="help2">Besoin d'aide ? <a href="carte.php">Cliquez ici</a>
  </div>
	</p>
</div>

<div id="bas">
blabla...
</div>

Le CSS : (j'ai essayé de filtrer pour ne garder que ce qui concerne les positions !)

#carte {
	width:405px;
	margin-left:1%;
	margin-top:1%;
	float:left;
}
#fiche {
	width:400px;
	margin-top:1%;
	margin-left:1%;
	float:left;
}
#head {
	height:20px;
	margin-bottom:2px;
}
#bandeau {
	height:63px;
}
#bandeau #logo_haut {
	float:left;
}
#pban {
	float:right;
}
#menug {
	height:25px;
	background:#EEEEEE;
}
#menu { width:74%; float:left; margin-top:4px;}
#help {  float:left; margin-top:4px;}

#menug2 {
	height:25px;}
#menu2 { width:74%; float:left; margin-top:4px;}
#help2 {  float:left; margin-top:4px;}
#bas {
	bottom:0;
	height:20px;
}
#bandeau_titre {
	height:25px;
}
#pub {
	width:160px;
	float:left;}

#map {
	width:400px;
	height:480px;
}
#map2 {
	width:400px;
}

Merci d'avance à celui ou celle qui saura m'aider .
(un chocolat envoyé par e-mail, ça ira ? )
Modifié par Clemdups (09 Jun 2006 - 09:56)

Bonjours,

a écrit :
Voici le code utilisé... Si vous avez le courage de le lire cligne .

Tu n'aurais pas un schéma et une page en ligne?

Salut,

essaye voir un clear:both pour ton footer

A+

Bien entendu Tu as raison, ça ne sera que plus clair, et ça vaut largement plus que tout un blabla .

http://www.mestofs.com/show.php/422/apercu.jpg .

Evidemment, tailles et couleurs ne sont que des aperçus...
En rose, j'ai mis là où se collent mes deux barres... En vert, là où elles se compressent (!!) sur IE.
En bas, vous verrez les deux barres telles que j'aimerais les avoir...

Merci

Bonjour, bonjour !

Hum : une vraie page, avec un vrai code : c'est possible ?

Clemdups a écrit :
Certes, j'utilise peut-être un peu trop de float dans ma page, mais je ne vois pas en quoi ça poserait un problème...

Moi je crois que je vois.
En tout cas d'après ton schéma, je reconnais un comportement standard des flottants. Par contre pour IE j'avoue que ça me laisse perplexe.

Pour le problème de dépassement des flottants, quelques infos :
http://web.covertprestige.info/test/03-elements-flottants-et-element-parent-1.html

Vero a écrit :
Hum : une vraie page, avec un vrai code : c'est possible ?

+1

a écrit :

Hum : une vraie page, avec un vrai code : c'est possible ?

Ouhaou, la remarque qui tue Un côté Brice de Nice ?

Je ne fais PAS DU TOUT mon code comme ça d'habitude, mais comme tout un tas de choses ont été rajoutées les unes à la suite des autres (imprévus), j'ai bricolé comme ça. La partie "carte", "map" et "map2" ne peut cependant PAS être autrement (enfin si, mais ça ne dépend pas de moi quoi...).
Mais je pense effectivement que je vais tout reprendre à zéro, étant donné que c'est surtout la partie PHP qui m'a donné du fil à retordre...
Mais grosso-modo, il est impossible d'avoir moins de "bandeaux" en haut de la page... je sais, c'est le bordel...
Enfin c'est surtout le menu je pense qui est troublant .

Merci pour vos réponses !

PS : quand des gens arrivent avec des tableaux dans tous les sens, vous leur dites quoi sur leur code ? ah pardon, personne ne vient avec des tableaux dans tous les sens ici .
Modifié par Clemdups (08 Jun 2006 - 21:09)

Salut

Vero a écrit :

Hum : une vraie page, avec un vrai code : c'est possible ?

Je ne pense pas qu’il faut prendre cette remarque pour une critique, mais comme une demande de voir réellement le code complet de ta page.

En claire : a tu un lien ou ont peux voir ta page !

A+
Modifié par gege71 (08 Jun 2006 - 22:07)

Clemdups a écrit :

Ouhaou, la remarque qui tue Un côté Brice de Nice ?

Heu,

Vero d'aubagne, en fait


Je demandais tout simplement la page en ligne et non son image et son code dans le topic.
Il est plus aisé de chercher l'origine d'un problème dans des conditions normales de test, c'est à dire lorsque la page générée est directement exploitable depuis le navigateur et les outils de developpement associés.

Oh mille excuses dans ce cas .
J'avais mal compris... Désolé, je dois être un peu sur les nerfs en ce moment ^^
Sincèrement désolé ! *ne sait plus où se mettre*

Il n'y a pas de problème.

Bien, j'ai résolu le problème, en tatonnant un peu...
Au cas où ça intéresserait quelqu'un, je rajoute l'astuce : j'ai rajouté une div qui contient toutes celles du bas, avec un style comme suit :

#bas {position:relative;clear:both;}

(en effet le clear:both; est bien utile. Sans lui, ça marchait sur IE mais pas sur Firefox. Avec lui, ça marche sur les deux ).

Merci encore à ceux qui ont pris le temps de me répondre ! Je m'en vais de ce pas rajouter un [résolu] au sujet .
Modifié par Clemdups (09 Jun 2006 - 09:57)

Faut dire aussi que Vero, avec un titre d'aiguilleuse, on peut aisément l'imaginer avec des talons aiguilles et un fouet ce qui expliquerait du coup la confusion de "Clemdups" qui croyait s'adresser à "maîtresse Vero"