web-dev-qa-db-fra.com

Comment rendre la barre de défilement d'une div visible uniquement lorsque cela est nécessaire?

J'ai cette div:

<div style='overflow:scroll; width:400px;height:400px;'>here is some text</div>

Les barres de défilement sont toujours visibles, même si le texte ne déborde pas. Je souhaite que les barres de défilement ne soient visibles que lorsque cela est nécessaire, c'est-à-dire uniquement lorsque le texte dans la zone est suffisant. Comme un textarea fait. Comment puis-je faire cela? Ou est-ce que ma seule option est de styler une textarea pour qu’elle ressemble à une div?

csshtmlscrollbar
121
Benubird

Utilisez overflow: auto. Les barres de défilement n'apparaissent qu'en cas de besoin.

(Sidenote, vous pouvez également spécifier uniquement pour la barre de défilement x ou y: overflow-x: auto et overflow-y: auto).

248
Hidde

essaye ça:

<div style='overflow:auto; width:400px;height:400px;'>here is some text</div>
12
kleinohad

essayer 

<div id="boxscroll2" style="overflow: auto; position: relative;" tabindex="5001">
6
GrvTyagi

essayer

<div style='overflow:auto; width:400px;height:400px;'>here is some text</div>
6
pbaris

Vous pouvez essayer avec ci-dessous un:

  <div style="width: 100%; height: 100%; overflow-x: visible; overflow-y: scroll;">Text</div>
0
Papun Sahoo

J'ai trouvé que la hauteur de la div est toujours visible, qu'elle ait du texte ou non Vous pouvez donc l'utiliser pour obtenir de meilleurs résultats.

<div style=" overflow:auto;max-height:300px; max-width:300px;"></div>
0
Shailendra Kumar