Hiển thị thanh cuộn dọc Div

Question

Tôi tự hỏi làm thế nào có thể hiển thị vĩnh viễn thanh dọc của một div (chuyển thành màu xám nếu không có cuộn) tương tự như các thanh thông thường của chúng tôi. Về cơ bản tôi đang cố gắng để đặt toàn bộ một trang web trong một div (như gmail/facebook), vì vậy nếu trang không đủ dài toàn bộ trang thay đổi vì thiếu thanh cuộn dọc.

Tôi cần giải pháp cho vấn đề này. Tôi đã thử overflow-y: cuộn. Nhưng nó dường như không hoạt động chút nào.

Answer 1

Bạn đang thử nghiệm trình duyệt nào?

DOCType nào bạn đã đặt?

Bạn khai báo chính xác CSS của mình như thế nào?

Bạn có chắc chắn bạn chưa bỏ lỡ ; trước/sau overflow-y: scroll?

Tôi vừa thử nghiệm sau đây trong IE7 và Firefox và nó hoạt động tốt

<!-- Scroll bar present but disabled --> 
<div style="width: 200px; height: 100px; overflow-y: scroll;"> 
    test 
    </div> 
<!-- Scroll bar present and enabled -->   
    <div style="width: 200px; height: 100px; overflow-y: scroll;"> 
    test<br /> 
    test<br /> 
    test<br /> 
    test<br /> 
    test<br /> 
    test<br /> 
    test<br /> 
    test<br /> 
    test<br /> 
    test<br /> 
    </div> 

Answer 2

Bạn đã thử tràn-y: tự động chưa? Nó không phải là chính xác những gì bạn muốn, vì thanh cuộn sẽ chỉ xuất hiện khi cần thiết.

Answer 3

Luôn: Nếu bạn luôn muốn thanh cuộn dọc, sử dụng overflow-y: scroll;

jsFiddle:

<div style="overflow-y: scroll;"> 
...... 
</div> 

Khi cần: Nếu bạn chỉ muốn theo chiều dọc al thanh cuộn khi cần thiết, sử dụng overflow-y: auto; (Bạn cần phải xác định một chiều cao trong trường hợp này)

jsFiddle:

<div style="overflow-y: auto; height:150px; "> 
.... 
</div>