Challenge CSS : Positionner un div en absolute en bas de page...

Marsh Posté le 26-05-2007 à 15:25:17

Bonjour à tous

Bon, je galère depuis un moment, et fais pas mal de recherche, mais il n'y a rien à faire, IE et FF c'est toujours autant le bordel.

J'ai une page avec tout en positionnement absolute (demandé par le client...).
Je veux avoir un pied de page en dessous du contenu de ma page, sous firefox comme sous IE.
Le gros problème, c'est que ce contenu est variable (requete dans base de données), donc je ne peux pas connaître simplement la hauteur.

Je pensais à un bottom: 0px; mais IE n'aime pas trop ça...

Je cherche donc une solution.

La première que j'ai trouvé c'est d'avoir le body en height: 100%; et le conteneur de page en min-height: 100%, ce qui arrange bien pour FF, mais pas pour IE.
Je suis dans une impasse, et il me faut ce footer...

Voilà, si vous avez des idées, et/ou des solutions, merci d'avance.

(Je posterais des bouts de code si besoin, mais là de toute façon, ça marche pas vraiment...)

Merci :hello:

Reply

Marsh Posté le 26-05-2007 à 15:25:17

Reply

Marsh Posté le 26-05-2007 à 16:30:23

La question est posée assez fréquemment.
Dans mes archives, j'ai conservé le code suivant qui marche bien, mais qui utilise une table :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>XHTML strict 1.0 positionnement</title>
<style type="text/css" />
html, body {
height: 100%;
margin: 0;
}

#global {
width: 750px;
margin: auto;
height:100%;
background-color:#3399FF;
}
#header {
width: 750px;
height: 150px;
background-color:#CC0000;
}

#menu {
height:80px;
width: 750px;
background-color: #ffff00;
}
#corps {
width: 750px;
height: 300px;
background-color:#FF6633;
}
#footer {
width: 750px;
height: 30px;
background-color:#339933;
}
</style>
</head>
<body>
<div align="center">
<center>
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" height=100%>
<tr>
<td id="header">HEADER</td>
</tr>
<tr>
<td id="menu">MENU</td>
</tr>
<tr>
<td id="corps">CORPS</td>
</tr>
<tr>
<td id="footer">FOOTER</td>
</tr>
</table>
</center>
</body>
</html>

Reply

Marsh Posté le 26-05-2007 à 16:44:39

Merci.

J'avais pensé à la table, mais j'ai bien peur que, au point ou j'en suis du projet, foutre une table me pose problème. Surtout que, comme je l'ai précisé, j'ai déjà plein de divs, qui sont tous en absolute.

Ya pas un moyen de dire à ces p$$$$s de navigateurs de caler ce div en bottom: 0px; ou en top: 100% (du contenu, et pas que de la page visible..., ya un scroll...) ?

Reply

Marsh Posté le 26-05-2007 à 18:02:10

je vois pas l'intéret d'exiger que tout soit en absolute, ça emmerde le webmaster plus qu'autre chose !
l'est bizarre ton client :heink:

---------------
Nikon D7000 + 18-105VR + 35mm 1.8

Reply

Challenge CSS : Positionner un div en absolute en bas de page...

Sujets relatifs:

Leave a Replay