How to Make a DIV Vertically Scrollable Using CSS
Topic: HTML / CSSPrev|Next
Answer: Use the CSS overflow-y
Property
You can simply use the CSS overflow-y
property to make a <div>
element vertically scrollable, in a situation where it has a fixed height and its content is larger than the content area.
In the following example the vertical scrollbar will be visible only when the content exceeds the div's content area. Let's try it out to understand how it basically works:
Example
Try this code »<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Making a DIV Vertically Scrollable using CSS</title>
<style>
.box{
border: 2px solid #000;
padding: 15px;
overflow-y: auto;
height: 200px;
}
</style>
</head>
<body>
<div class="box">
<p>Lorem ipsum dolor sit amet...</p>
</div>
</body>
</html>
Related FAQ
Here are some more FAQ related to this topic: