[Resolu] Baniere avec une taille fixe (Firefox + IE7)

Bonjour,

Je desire mettre une baniere fixe au sommet des pages de mon site. Pour ce faire, j'utilise le code CSS suivant:

#layout-banner-box {
  position: fixed;
  border-bottom: 2px solid #1d2a5a;
  top: 0px;
  left: 200px;
  width: 100%;
  height: 129px;
  z-index: 2;
  background-color: #6e78aa;
}

Pour la partie contenu, j'utilise les deux blocs CSS suivants:

#layout-content-box {
  position: relative;
  margin-top: 140px;
  margin-left: 180px;
  background-color: #d6daeb;
}

#layout-content {
  font-family: Bitstream Vera Sans, Arial, Verdana;
  padding-top: 0.2em;
  padding-left: 1.0em;
  padding-right: 0.4em;
}

Dans l'ensemble, je suis relativement satisfait du resultat. Cela dit j'aimerai eviter le chevauchement entre le div 'header' et le div 'content' lorsque je scroll dans ma page. Ceci est particulierement genent lorsque l'on selectionne un element de la table des matieres car l'on ne voit pas le debut du texte!

Page d'exemple: http://www.rapazp.ch/opensource/tools/asciidoc[/lien]

Si vous avez une piste ou une solution elle serait la bien venue!

Salut,


Ton URL ne fonctionne malheureusement pas, tu l'as rédigée sans tenir compte des explications données dans l'Aide du forum et dans la FAQ

Je te suggère vivement d'éditer ton message afin de corriger ce problème.

Bonjour,

C'est une limite du positionnement fixe : le fait que tu aies un en-tête de X pixels en position: fixed ne signifie pas que le reste de la page soit réduit en hauteur d'autant. Le comportement du focus sur une ancre place cette ancre en haut de la fenêtre, et le haut de la fenêtre est caché par l'en-tête. C'est parfaitement normal.

Dans les solutions possibles :
- ne pas avoir d'en-tête fixe (on pourra garder le menu de gauche fixe, par contre) ;
- une fonction Javascript qui, à la prise de focus sur une ancre dans le bloc de contenu, fait défiler le bloc de contenu de X pixels vers le bas.

La deuxième solution (pas idéale je suppose) est théorique, je ne l'ai jamais mise en place...

Merci Florent pour ces precisions, je vais de ce pas tenter voir ce que je peux faire cote Javascript pour corriger ce probleme

A+

Nono's