Scroll bar inexistante

[mathieu147]

Bonjour à tous,

Comme vous pouvez le constater sur mon site, quand la fenêtre est trop petite pour le menu de gauche, il n'y a pas de scrollbar qui apparaît.

J'ai fait

<div id="menu">
<h1>Menu</h1>
<ul>
  <li> etc...
</ul>
</div>

et voici le css associé au div:

#menu
    {
    position         : fixed;
    left             : 0;
    width            : 150px;
    height           : 100%;
    margin-left      : 0px;
    margin-top       : 0px;
    padding          : 0px;
    }

(J'ai simplifié les codes pour garder l'essentiel).

Comment faire pour pouvoir scroller? Parce qu'au fur et à mesure que je vais mettre mon ite à jour, mon menu va s'agrandir, et de plus en plus de boutons seront inaccessibles

Merci

[petit-ourson]

C'est le fixed qui pose probleme. Il faudrait "encapsuler" ton men dans un conteneur avec un overflow: scroll ...

Edit : En fait il suffirait juste de mettre un "overflow:scroll" sur ton identifiant #menu.

Modifié 2 Janvier 2005 par petit-ourson

[Ernestine]

ou alors, remplacer

position: fixed;

par

position: absolute;

Ernestine

[LaurentDenis]

Hum... Mettre un menu en fixe (donc non scrollable s'il dépasse la hauteur de l'écran) pour le rendre ensuite scrollable avec overflow... C'est un peu tordu, non ?

Par ailleurs, l'overflow:scroll fait générer des barres de scroll internes à la page, ce qui est assez disgracieux. Et compromet partiellement l'accessibilité en rendant l'accès-clavier beaucoup plus difficile, voire parfois impossible.

Vu sa longueur indéfinie, ce menu gagnerait plus simplement à être en position absolue, comme le suggère Ernestine.

[petit-ourson]

je donnais juste une solution pour voir apparaitre les barres de défilement, c'est sur que ce n'est pas du plus gracieux ;o)

[mathieu147]

A la réflexion, c'est vrai qu'une scroll bar au milieu de la page ça aurait été vachement moche... Donc j'ai changé fixed en absolute.

Sauf que maintenant, ça fait un truc laid Malgré que j'aie mis

height : 100%

Le fond bleu du menu ne fait que la hauteur de la fenêtre, et donc ne descend pas assez bas.

Enfin, retournez voir sur mon site, parce que rien qu'avec mes explications, vous risquez d'avoir du mal à comprendre le problème

Et merci pour vos réponses

[Ernestine]

Si si c'est parfaitement compréhensible, et c'est un problème bien connu... avec height:100%, la boîte a pour hauteur celle de l'écran. Il n'y a pas grand chose à faire au niveau du Div lui-même pour y remédier. Par contre, tu peux mettre une image de fond pour ta page web, image faite de deux couleurs : bleue à gauche et blanche à droite, avec répétition sur la hauteur, pour "simuler" deux colonnes (vu sur Alistapart).

Ernestine

[mathieu147]

Ca me plaît pas tellement de faire comme ça, je trouve pas ça "propre".

Donc je change un peu tout, et je mets le menu de la même couleur que le reste.

Merci quand-même