แสดงแถบเลื่อนแนวตั้ง Div

ฉันสงสัยว่าเป็นไปได้อย่างไรที่จะแสดงแถบแนวตั้งของ div อย่างถาวร (เป็นสีเทาหากไม่มีการเลื่อน) คล้ายกับแถบปกติของเรา โดยทั่วไปฉันกำลังพยายามวางเว็บไซต์ทั้งหมดใน div (เช่น gmail / facebook) ดังนั้นหากหน้าเว็บมีความยาวไม่เพียงพอทั้งหน้าจะเลื่อนเนื่องจากไม่มีแถบเลื่อนแนวตั้ง

ฉันต้องการวิธีแก้ปัญหานี้ ฉันลอง overflow-y: scroll แต่ดูเหมือนจะไม่ได้ผลเลย

คุณกำลังทดสอบเบราว์เซอร์ใด

คุณตั้งค่า DOCType อะไร

คุณประกาศ CSS ของคุณอย่างไร?

แน่ใจหรือว่าคุณไม่พลาด;ก่อน / หลังoverflow-y: scroll?

ฉันเพิ่งทดสอบสิ่งต่อไปนี้ใน IE7 และ Firefox และใช้งานได้ดี

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

<!-- Scroll bar present and enabled when more contents -->        
<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>

คุณลองแล้วoverflow-y:autoหรือยัง? ไม่ใช่สิ่งที่คุณต้องการอย่างแน่นอนเนื่องจากแถบเลื่อนจะปรากฏขึ้นเมื่อจำเป็นเท่านั้น

เสมอ:หากคุณต้องการแถบเลื่อนแนวตั้งเสมอให้ใช้overflow-y: scroll;

jsFiddle:

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

เมื่อจำเป็น : หากคุณต้องการแถบเลื่อนแนวตั้งเมื่อจำเป็นเท่านั้นให้ใช้ overflow-y: auto;(คุณต้องระบุความสูงในกรณีนี้)

jsFiddle:

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