Problème de pied de page.

**spawn892** · 11/02/2008, 23h32

Bonjour, à toute la communauté.
Je m'appelle Edouard, je bosse en tant que webmaster en alternance.

J'ai un probleme dont je n'arrive pas à trouver la solution. voila.
Je n'arrive pas à mettre le pied de page. J'ai mis la page ICI.

Avec Firefox, le pied de page se positionne, comme il faut. Or il faut que cela soit compatible avec Internet Explorer. Je travaille avec ie 6 et firefox.

En vous remerciant, j'espère que quelqu'un trouvera la réponse à mon probleme.

**kaiser59** · 11/02/2008, 23h50

Salut,

Ton div global ici #body2 ne doit pas contenir le header et le footer c'est trois éléments doivent être séparé. Tu dois avoir donc ceci :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
<div id="header">
  <!-- tu mets ton formulaire de recherche, tes drapeaux etc... -->
</div>
 
<div id="contenu">
  <!-- Contenu du milieu -->
</div>
 
<div id="footer">
  <p>WAM - 56 Boulevard Danielle Casanova - 13014 Marseille - FRANCE - Tel: (33)4 91 58 27 67 - Fax: (33)4 91 58 23 98
Contact</p>
</div>

partie css :

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
#header, #contenu, #footer
{
width : 800px;
margin-left:auto;
margin-right:auto;
}
 
#header 
{
height:150px;
background: transparent url(http://www.iduse.fr/prob_css/index.php_fichiers/header.png) no-repeat;}
 
#footer 
{
 height: 50px;
 text-align:center;
}
 
#contenu 
{
 min-height:500px;
}

etc... c'est juste pour t'aider après tu adaptes

**spawn892** · 12/02/2008, 00h01

Merci pour cette réponse rapide. je vais mettre en application ce code dès demain.

Edit:

J'ai un petit doute. Cela marche dans le cas ou le milieu est plein. car si le milieu est vide, il faut que mon footer soit en bas. Donc pour moi il faudrait qu'il soit en absolute, avec bottom: 0 non?

Merci.

**spawn892** · 12/02/2008, 10h32

Toujours le même probleme, en plus min-height, n'est reconnu que par firefox, ie ne l'interprete pas.

**sevian** · 12/02/2008, 11h45

oui IE ne comprend pas min-height

perso j'utilise cette astuce:

tu ajoutes dans la partie <head></head> de ta page :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
<!--[if IE]>
<style type="text/css">
#contenu {
height: 500px
}
</style>
<![endif]-->

ou tu pourrais aussi concevoir 2 css différent et tu appelles celle qu'il faut en détectant le navigateur.

bon courage

**spawn892** · 12/02/2008, 13h15

Merci de cette réponse, je vais la tester.

**Seta-san** · 12/02/2008, 13h18

Dans le Div de ton footer essaye le css suivant :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

clear:both;

Ton div footer se placera en dessous des autres si ils sont de type "float:..;"

Bonne continuation !

**kaiser59** · 12/02/2008, 13h35

Envoyé par sevian

oui IE ne comprend pas min-height

perso j'utilise cette astuce:

tu ajoutes dans la partie <head></head> de ta page :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
<!--[if IE]>
<style type="text/css">
#contenu {
height: 500px
}
</style>
<![endif]-->

ou tu pourrais aussi concevoir 2 css différent et tu appelles celle qu'il faut en détectant le navigateur.

bon courage

Tu dois avoir beaucoup de css externe si on t'écoute Sevian

tu peux rajouter tout simplement ceci dans la même page css :

* html #contenu {hieght:500px;}

Seul sur IE6 le div contenu changera de taille

**spawn892** · 12/02/2008, 16h41

Merci, j'ai réglé je pense mon probleme. Seulement maintenant je m'arrache les cheveux sur une espace qui apparait sur ie( oui encore! lol!) si on affiche la page. avec ie, on remarque que le menu horizontal est légèrement décalé par rapport au header.

La page est visible depuis le lien que j'ai mis dans le sujet.

Franchement je cherche aux alentour du div menu_h et header, mais je ne vois pas...(avec firefox, aucun probleme of course.)

En vous remerciant.

**sevian** · 14/02/2008, 11h18

Met nous le code correspondant spawn892, ca ira plus vite à debuger

-- hors sujet --
je ne comprends pas ta solution kaiser59

* - toutes les balises
html - balise html
#contenu - id contenu à 500px de haut

et tu insere ca dans la css !?

ps: non je n'ai pas plein de css, j'utilise <if IE> et je corrige les differences. je ne sait pas faire autrement

-- fin hors sujet --

**kaiser59** · 14/02/2008, 15h10

Envoyé par sevian

Met nous le code correspondant spawn892, ca ira plus vite à debuger

-- hors sujet --
je ne comprends pas ta solution kaiser59

* - toutes les balises
html - balise html
#contenu - id contenu à 500px de haut

et tu insere ca dans la css !?

ps: non je n'ai pas plein de css, j'utilise <if IE> et je corrige les differences. je ne sait pas faire autrement

-- fin hors sujet --

Déjà d'une c'était pour te taquiner quand je te dis : "Tu dois avoir beaucoup de css externe si on t'écoute Sevian "

Ensuite, faudrait que tu sache que :
"* html" s'appel un hack en css et qu'il a pour but d'affecter uniquement IE6 ou 7 selon si tu ajoute un + devant html

Ainsi au lieu d'avoir t'as ligne de code

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
<!--[if IE]>
<style type="text/css">
#contenu {
height: 500px
}
</style>
<![endif]-->

qui fait 7 ligne au passage moi je te la résume en 1 ligne et qui reste dans le css

avec simplement :

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

* html #contenu {height: 500px;}

Je trouve cela plus simple et beaucoup plus rapide que ta solution.

Par ailleurs * ne s'applique pas à toutes les balise comme tu le fais remarqué quand tu l'associe avec html, il comprend qu'il ne doit appliquer cela qu'à IE6.