Post
Ask Question

Overflow Property In CSS

Overflow Property In CSS

 
The Overflow property specifies that what we should do if the content of an Element Box Overflows. It has five property values:
  1. Hidden: In this the Overflow part of the content is Hidden and the rest will be shown.
  2. Visible: The Overflow will be visible. It renders outside the Element's Box
  3. Scroll: If the Overflow is Clipped, the scroll bar is added to see the rest of the content.
  4. Auto: If the Overflow is clipped, a scroll bar should be added automatically.
  5. Inherit: Specifies that the value of the overflow property should be inherited from the parent element
For Ex:
  1. <html>  
  2.   
  3.    <head>  
  4.       <style type="text/css">  
  5.       div.scroll   
  6.       {  
  7.          background-color: Pink;  
  8.          width: 100px;  
  9.          height: 100px;  
  10.          overflow: scroll;  
  11.       }  
  12.       </style>  
  13.    </head>  
  14.   
  15.    <body>  
  16.       <div class="scroll">The clients included businessmen from Mumbai and Delhi and a few Bollywood personalities, who wanted the agency to spy on either their spouses or rivals.</div>  
  17.    </body>  
  18.   
  19. </html> 
Next Recommended Reading empty-cells property in CSS