Bonjour à tous,
J'ai un problème assez simple : un site avec une DIV centrale qui doit s'ajuster à la hauteur (jusqu'au bas) d'une autre DIV et ça fonctionne parfaitement, sauf si je mets un DOCTYPE, et je veux dire par là n'importe quel DOCTYPE!
Voyez par vous-même. Voici mon site que j'ai simplifié au maximum. La DIV textecentre devrait, comme elle le fait quand il n'y a pas de DOCTYPE, aller jusqu'au bas de la DIV overall et s'arrêter là, et une scrollbar s'ajouter à droite. Mais lorsqu'on met un DOCTYPE, elle s'allonge tant qu'il y a du texte! Quelqu'un peut m'aider?
Mise à jour : Il y a pas mal de problèmes postés sur des forums concernant le document.body.clientHeight qui ne fonctionne pas sous IE. Mais contrairement à moi, tout le monde semble avoir merveilleusement réglé le problème en remplaçant ça par document.documentElement.clientHeight... je poursuis donc mes recherches et je le remplace dans mon code, pour que si quelqu'un trouve la solution ça soit susceptible de marcher. Du coup, mon message devrait probablement être déplacé dans le forum de javascript, je suis désolé je ne pouvais pas le savoir avant ces nombreuses heures de recherche.
Modifié par Zno (03 Jun 2013 - 20:22)
J'ai un problème assez simple : un site avec une DIV centrale qui doit s'ajuster à la hauteur (jusqu'au bas) d'une autre DIV et ça fonctionne parfaitement, sauf si je mets un DOCTYPE, et je veux dire par là n'importe quel DOCTYPE!
Voyez par vous-même. Voici mon site que j'ai simplifié au maximum. La DIV textecentre devrait, comme elle le fait quand il n'y a pas de DOCTYPE, aller jusqu'au bas de la DIV overall et s'arrêter là, et une scrollbar s'ajouter à droite. Mais lorsqu'on met un DOCTYPE, elle s'allonge tant qu'il y a du texte! Quelqu'un peut m'aider?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- saved from url=(0014)about:internet -->
<HTML>
<HEAD>
<TITLE>Mon site</TITLE>
<script type="text/javascript">
function chk(){
my_div=document.getElementById("textecentre")
top_space=document.getElementById("textecentre").offsetTop
bottom_space=4
my_div.style.height=document.documentElement.clientHeight-top_space-bottom_space
}
onresize=chk
</script>
<style type="text/css">
html {height:100%;}
body {text-align:center; height:100%;}
#overall {margin:auto; width:990px; position:relative; height:100%; background-color:#6699CC;}
#textecentre {position:absolute; top:210px; right:260px; width:450px; height:auto; background-color:#99CCFF; overflow:auto;}
#footer {width:990px; height:68px; margin:auto; background-color:#006699;}
</style>
</HEAD>
<BODY onload="chk();">
<div id="overall">
<div id="textecentre">
<div id="IDpres"><pre>
présentation
présentation
présentation
présentation
présentation
présentation
présentation
présentation
présentation
présentation
présentation
présentation
présentation
présentation
présentation
présentation
présentation
présentation
présentation
présentation
présentation
présentation
présentation
</pre></div>
</div>
</div>
<div id="footer">
</div>
</BODY>
</HTML>Mise à jour : Il y a pas mal de problèmes postés sur des forums concernant le document.body.clientHeight qui ne fonctionne pas sous IE. Mais contrairement à moi, tout le monde semble avoir merveilleusement réglé le problème en remplaçant ça par document.documentElement.clientHeight... je poursuis donc mes recherches et je le remplace dans mon code, pour que si quelqu'un trouve la solution ça soit susceptible de marcher. Du coup, mon message devrait probablement être déplacé dans le forum de javascript, je suis désolé je ne pouvais pas le savoir avant ces nombreuses heures de recherche.
Modifié par Zno (03 Jun 2013 - 20:22)