Run Example

Edit This Code:
<!DOCTYPE html>  
<html>  
<head>  
<style>  
div.scroll {  
    width: 500px;
    height: 100px;
    background-color: lightblue;
    overflow: scroll;
}  
  
div.hidden {  
    width: 500px;
    height: 100px;
    background-color: green;
    overflow: hidden;  
}  
</style>  
</head>  

<body>   
  <p>overflow:scroll</p>  
  <div class="scroll">This is an example of overflow: scroll. This is an example of overflow: scroll. This is an example of overflow: scroll. This is an example of overflow: scroll. This is an example of overflow: scroll. This is an example of overflow: scroll. This is an example of overflow: scroll. This is an example of overflow: scroll. This is an example of overflow: scroll. This is an example of overflow: scroll. This is an example of overflow: scroll. This is an example of overflow: scroll. This is an example of overflow: scroll. This is an example of overflow: scroll. This is an example of overflow: scroll. This is an example of overflow: scroll. This is an example of overflow: scroll. This is an example of overflow: scroll. This is an example of overflow: scroll. </div>  
  <p>overflow:hidden</p>  
  <div class="hidden">This is an example of overflow: hidden. This is an example of overflow: hidden. This is an example of overflow: hidden. This is an example of overflow: hidden. This is an example of overflow: hidden. This is an example of overflow: hidden. This is an example of overflow: hidden. This is an example of overflow: hidden. This is an example of overflow: hidden. This is an example of overflow: hidden. This is an example of overflow: hidden. This is an example of overflow: hidden. This is an example of overflow: hidden. This is an example of overflow: hidden. This is an example of overflow: hidden. This is an example of overflow: hidden. This is an example of overflow: hidden. This is an example of overflow: hidden. </div>  
</body>

</html>
Result: