Positionné div, barre de défilement hors de la fenêtre du navigateur

Question

J'ai un div qui a un contenu défilant, mais il est essentiel que ce div, est positionné relativement avec une marge de 36px du haut du navigateur, ou absolument positionné par le haut.

Il est également important que la division remplisse la hauteur de la fenêtre d'affichage du navigateur.

Mon problème est que le bas de la barre de défilement de la div ne peut pas être vu car il est enfoncé de 36px. Le contenu est également poussé vers le bas, mais j'ai été en mesure de contourner cela en ajoutant un rembourrage au fond. Cela arrive pour tous les navigateurs. Existe-t-il un moyen de faire en sorte que cette div possède une barre de défilement qui s'adapte à la fenêtre du navigateur et qui tient compte de la marge de la div du haut?

Le résultat est le même si j'ai positionné le div absolument ou relativement avec margin-top: 36px;

Le CSS pour ce div est comme suit:

div.#panel1 { 
    position: absolute; 
    top: 36px; 
    right: 0; 
    overflow: auto; 
    background: #636362; 
    padding: 0 0 20px 0px; 
    width: 290px; 
    height: 100%; 
} 

De plus, je trouve l'expérience de défilement dans IE 7 vraiment lent et saccadé pour cette div, mais la barre de défilement du navigateur est très bien? Y a-t-il un bug que je devrais connaître?

Answer 1

Vous pouvez définir à la fois top et bottom lors du positionnement de quelque chose d'absolument: http://jsfiddle.net/kizu/xSgTW/

Donc, si vous ne définissez pas height et définissez

top: 36px; 
bottom: 0; 

ensuite la ligne supérieure de la div serait sur 36px et en bas Eh bien, au fond. En ce qui concerne le défilement: il peut y avoir beaucoup de choses qui affectent la vitesse de défilement dans IE, mais AFAIR le défilement dans les blocs avec overflow: auto est toujours plus lent que le défilement du body.