Jak mogę automatycznie dodać pionowy pasek przewijania do mojego div?

Question

Chcę dodać pionowy pasek przewijania do mojego <Div>. Próbowałem już overflow:auto, ale to nie działa. Przetestowałem swój kod w Firefoksie i Chrome. jestem wklejeniu kodu styl Div tutaj:

float:left; 
width:1000px; 
overflow: auto; 

Z góry dzięki.

Answer 1

Należy przypisać wysokość, aby działała właściwość overflow: auto;.
Do celów testowych dodaj height: 100px; i sprawdź.
, a także będzie lepiej, jeśli podasz overflow-y:auto; zamiast overflow: auto;, ponieważ spowoduje to przewijanie elementu tylko w pionie, ale nie w poziomie.

float:left; 
width:1000px; 
overflow-y: auto; 
height: 100px; 

Jeśli nie wiem wysokość pojemnika i chcesz pokazać pionowy pasek przewijania, gdy pojemnik osiąga stałą wysokość powiedzieć 100px użyć max-height zamiast height nieruchomość.

Aby uzyskać więcej informacji, przeczytaj ten MDN article.

Answer 2

Nie jestem do końca pewien, na co próbujesz użyć div, ale jest to przykład z przypadkowym tekstem.

Mr_Green podał prawidłowe instrukcje, gdy dodał, że dodaje overflow-y: auto, ponieważ ogranicza to do przewijania w pionie. Jest to JSFiddle przykład:

JSFiddle

Answer 3

Aby pokazać pionowego paska przewijania w swojej div trzeba dodać

height: 100px; 
overflow-y : scroll; 

lub

height: 100px; 
overflow-y : auto; 

Answer 4

Trzeba dodać max-height nieruchomości.

.ScrollStyle 
 
{ 
 
    max-height: 150px; 
 
    overflow-y: scroll; 
 
}

<div class="ScrollStyle"> 
 
    Scrollbar Test!<br/> 
 
    Scrollbar Test!<br/> 
 
    Scrollbar Test!<br/> 
 
    Scrollbar Test!<br/> 
 
    Scrollbar Test!<br/> 
 
    Scrollbar Test!<br/> 
 
    Scrollbar Test!<br/> 
 
    Scrollbar Test!<br/> 
 
    Scrollbar Test!<br/> 
 
    Scrollbar Test!<br/> 
 
</div>

Answer 5

mam niesamowitą scroller na mojej div-popup. Aby zastosować, należy dodać ten styl do elementu div:

overflow-y: scroll; 
height: XXXpx; 

height podasz będzie wysokość div i raz jeśli zawartość przekracza tę wysokość, trzeba go przewijać.

Dziękuję.

Answer 6

Można ustawić:

overflow-y: scroll;height: XX px