Hauteur de div automatique selon la copie d'écran proposée

**nilsb13** · 16/08/2011, 16h38

Bonjour,
j'ai posté la même question dans CSS,
mais peut-être que la solution est du côté javascript ...

selon la copie d'écran suivante :

Je voudrais que la div qui est entourée d'un liseret rouge soit taillée automatiquement à l'espace restant (elle a pour le moment une hauteur fixe)
et que sont ascenseur vertical s'allume si nécessaire.

Là, on voit qu'il reste de l'espace libre, blanc, avant le bas du navigateur.

Les div qui sont avant la dernière div (entourée d'un liseret rouge) n'ont pas de hauteur connue.
=>Leur hauteur augmente en fonction du contenu, lignes de boutons ou lignes de champs de formulaire (le formulaire bleu).

quelqu'un saurait-il me donner le code javascript permettant de connaitre l'espace libre sous la div (div_boutons_resultat) qui contient "modifier supprimer interlocuteurs actions commerciales"

ce qui me permettrait de coder la hauteur de la dernière div "en live"

merci de me donner tout le nécessaire :

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
23
24
25
26
27
28
29
30
html {
height				: 100%;
}
 
body {
height				: 100%;
margin: 0;
padding: 0;
}
 
#div_generale { /* celle qui englobe toute la page */
background-color : burlywood; /* marron clair */
/* code ... si nécessaire ... */
}
 
#div_ajouter_rechercher { /* zone bleu-clair */
background-color : lightblue;
/* code ... si nécessaire ... */
}
 
#div_boutons_resultat { /* boutons dans la zone vert-clair */
background-color : lightgreen;
/* code ... si nécessaire ... */
}
 
#div_resultat { /* div contenant la liste des enregistrements trouvés */
background-color : lightgreen;
overflow-y : auto;
/* code ... si nécessaire ... */
}

JAVASCRIPT :
?!?!?! là je sais pas ce qu'il faut mettre ?!?!?!

HTML :

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
23
<html>
 
  <head>
  <!-- appel du CSS et du code javascript -->
  </head>
 
  <body>
 
    <div id="div_generale">
 
      <div id="div_ajouter_rechercher">
      </div>
 
      <div id="div_boutons_resultat">
      </div>
 
      <div id="div_resultat" height="exécution du code javascript">
      </div>
 
    </div>
 
  </body>
  </html>

mille merci pour votre aide !
Nils.

(je vois que quelqu'un est passé par là pour ajouter quelques balises, merci !)

Hauteur de div automatique selon la copie d'écran proposée

JavaScript

Mode arborescent

Discussions similaires

Partager

Partager