Merci, j'ai résolu le mien avec votre aide, en l'ajustant un peu car je veux un div 100% de largeur 100% de hauteur (moins de hauteur d'une barre inférieure) et pas de défilement sur le corps (sans pirater / cacher les barres de défilement).
Pour CSS:
html{
width:100%;height:100%;margin:0px;border:0px;padding:0px;
}
body{
position:relative;width:100%;height:100%;margin:0px;border:0px;padding:0px;
}
div.adjusted{
position:absolute;width:auto;height:auto;left:0px;right:0px;top:0px;bottom:36px;margin:0px;border:0px;padding:0px;
}
div.the_bottom_bar{
width:100%;height:31px;margin:0px;border:0px;padding:0px;
}
Pour HTML:
<body>
<div class="adjusted">
// My elements that go on dynamic size area
<div class="the_bottom_bar">
// My elements that goes on bottom bar (fixed heigh of 31 pixels)
</div>
</div>
Cela a fait l'affaire, oh oui, j'ai mis une valeur un peu plus grande sur div.justée pour le bas que pour la hauteur de la barre inférieure, sinon la barre de défilement verticale apparaît, j'ai ajusté pour être la valeur la plus proche.
Cette différence est parce que l'un des éléments de la zone dynamique ajoute un trou inférieur supplémentaire dont je ne sais pas comment me débarrasser ... c'est un tag vidéo (HTML5), veuillez noter que j'ai mis ce tag vidéo avec ce css ( il n'y a donc aucune raison pour qu'il fasse un trou au fond, mais il le fait):
video{
width:100%;height:100%;margin:0px;border:0px;padding:0px;
}
L'objectif: avoir une vidéo qui prend 100% du navigateur (et se redimensionne dynamiquement lorsque le navigateur est redimensionné, mais sans modifier le rapport d'aspect) moins un espace inférieur que j'utilise pour une div avec quelques textes, boutons, etc. (et validateurs w3c & css bien sûr).
EDIT: J'ai trouvé la raison, le tag vidéo est comme du texte, pas un élément de bloc, donc je l'ai corrigé avec ce CSS:
video{
display:block;width:100%;height:100%;margin:0px;border:0px;padding:0px;
}
Notez la display:block;
balise on video.