Solution de mise en page de quai CSS ou table pour l'en-tête non défilant?

Question

J'ai un en-tête de hauteur variable qui ne défile pas avec le contenu en dessous. Le contenu agira comme une page Web normale, avec overflow = auto, contraint à la taille de la fenêtre.

Je n'ai pas encore trouvé de solution CSS sans table, et l'utilisation des débordements de tables ne fonctionne pas correctement - la ligne du bas de la table n'est pas contrainte à la hauteur de la hauteur de l'en-tête.

Cela semble un problème plutôt simple et commun. Quelqu'un at-il trouvé une solution de travail? Je suis capable d'ignorer IE < 8, si cela aide.

Answer 1

Comme vous ne prenez pas en charge IE6, vous pouvez définir l'en-tête sur position: fixed pour l'empêcher de défiler avec le document.

Notez que la barre de défilement s'étendra toujours jusqu'en haut de l'en-tête, vous devez donc ajouter un remplissage au début de votre contenu afin que lorsque vous le faites défiler vers le haut, il ne se retrouve pas derrière l'en-tête.