The CSS overflow property
determines how content which overflows its element's content area should be handled.
Possible Values (Properties)
- visible-- Overflowing content should be displayed.
- hidden-- Overflowing content should not be displayed.
- scroll-- Overflowing content should not be displayed, but the user agent should provide some means of accessing the hidden content (e.g., a set of scrollbars).
auto-- The behavior caused by this value is dependent on the browser.
Steps---
1.First create index.html page as follows--(you can change your tags according to your requirements)
![enter image description here](http://tech.queryhome.com/?qa=blob&qa_blobid=5701363031807076283)
2.Then create styles.css
![enter image description here](http://tech.queryhome.com/?qa=blob&qa_blobid=3811195642457710383)
OUTPUT for the above code
![enter image description here](http://tech.queryhome.com/?qa=blob&qa_blobid=9736649415772996526)
For hidden overflow
change that overflow as hidden (snapshot is given below)
![enter image description here](http://tech.queryhome.com/?qa=blob&qa_blobid=3918661736138245118)
OUTPUT for above code
![enter image description here](http://tech.queryhome.com/?qa=blob&qa_blobid=7416944722842863295)
For scroll overflow(go through given snapshot)
![enter image description here](http://tech.queryhome.com/?qa=blob&qa_blobid=13085981565306275713)
OUTPUT for the above code
![enter image description here](http://tech.queryhome.com/?qa=blob&qa_blobid=18322612432264691927)
For auto overflow-
change the overflow as auto the output will be--
![enter image description here](http://tech.queryhome.com/?qa=blob&qa_blobid=3458490919903887818)
Thanks