Déjà bonjour à tous
Alors voila mon soucis j'ai une div appelée "conteneur" sur la gauche qui doit être en hauteur variable selon son contenu et à droite de celle-ci une autre div appelée "navig" qui doit faire la même hauteur avec un overfow-y qui contient une liste de vignettes
J'ai réussi a obtenir ce que je voulais mais du avoir recours a javascript pour appliquer la hauteur de "conteneur" à "navig" je voudrais le même résultat mais sans javascript (je précise que je me suis arrachée les cheveux quelques heures avant de bidouiller du javascript )
J'aurais besoin de vos lumière pour le faire en css pure
d'avance merci pour votre aide
Alors voila mon soucis j'ai une div appelée "conteneur" sur la gauche qui doit être en hauteur variable selon son contenu et à droite de celle-ci une autre div appelée "navig" qui doit faire la même hauteur avec un overfow-y qui contient une liste de vignettes
J'ai réussi a obtenir ce que je voulais mais du avoir recours a javascript pour appliquer la hauteur de "conteneur" à "navig" je voudrais le même résultat mais sans javascript (je précise que je me suis arrachée les cheveux quelques heures avant de bidouiller du javascript )
J'aurais besoin de vos lumière pour le faire en css pure
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>MMA</title>
<style type="text/css">
<!--
body,html{margin:0 0 0 0;width:100%;height:100%;background-color:#ccc;font-family:Arial, Helvetica, sans-serif;font-size:12px;}
.h100{height:100%;}
.menu{width:950px;height:30px;background-color:#333;}
.format{width:155px;height:155px;margin:0px 5px 5px 5px;background-color:#000;}
-->
</style>
</head>
<body>
<center>
<div class="h100" style="width:970px;background-image:url(images/ombre_bord.png);">
<div class="h100" style="width:950px;background-color:#666;">
<div style="width:950px;height:165px;"></div>
<div class="menu"></div>
<div id="conteneur" class="h100" style="float:left;width:745px;background-color:#fff">
<br>
<div style="width:705px;height:305px;margin:0px 20px 10px 20px;background-color:#999;"></div>
<br><br><br><br><br><br><br><br><br><br><br>
<textarea name=""></textarea>
<br><br>
Hauteur de bloc variable
</div>
<div style="float:right;width:205px;background-color:#ccc">
<div id="navig" style="width:205px;overflow-y:scroll;">
<center>
<br>
<div class="format"></div>Prévu 165x165<br><br>
<div class="format"></div>Prévu 165x165<br><br>
<div class="format"></div>Prévu 165x165<br><br>
<div class="format"></div>Prévu 165x165<br><br>
<div class="format"></div>Prévu 165x165<br><br>
</center>
</div>
</div>
<p style="clear:both;height:0px;"></p>
<div style="width:950px;height:165px;">
</div>
</div>
</div>
<div style="width:970px;height:10px;background-image:url(images/ombre_bas.png);"></div>
</center>
<br>
<script type="text/javascript">
<!--
var divHeight;
var obj = document.getElementById('conteneur');
if (obj.offsetHeight) {divHeight=obj.offsetHeight;}
else if (obj.style.pixelHeight){divHeight=obj.style.pixelHeight;}
document.getElementById('navig').style.height = divHeight+'px';
//-->
</script>
</body>
</html>
d'avance merci pour votre aide