On this page, you will see code, and then to the right of the code, you'll see an example of what that code does. The differences in the code are highlighted in this color.

Example 1: visible - no overflow commands
In the head:
<style type="text/css">
div.none {background-color:#00FFFF; width:150px; height:150px}
</style>
In the body:
<div class="none"><br>
This is text inside the division
<img src="penga.jpg"><br>
That was a picture inside the division. You can put a lot of things in a division.
</div>
And you see...

This is text inside the division
That was a picture inside the division. You can put a lot of things in a division.
Example 2: scroll - mandatory scrollbars
In the head:
<style type="text/css">
div.scroll {background-color:#00FFFF; width:150px; height:150px; overflow: scroll}
</style>
In the body:
<div class="scroll"><br>
This is text inside the division
<img src="penga.jpg"><br>
That was a picture inside the division. You can put a lot of things in a division.
</div>
And you see...
This is text inside the division

That was a picture inside the division. You can put a lot of things in a division.
Example 3: auto - automatic scrollbars
In the head:
<style type="text/css">
div.auto {background-color:#00FFFF; width:150px; height:150px; overflow: auto}
</style>
In the body:
<div class="auto"><br>
This is text inside the division
<img src="penga.jpg"><br>
That was a picture inside the division. You can put a lot of things in a division.
</div>
And you see...
This is text inside the division

That was a picture inside the division.
You can put a lot of things in a division.
Example 4: hidden - hide the overflow
In the head:
<style type="text/css">
div.hidden {background-color:#00FFFF; width:150px; height:150px; overflow: hidden}
</style>
In the body:
<div class="hidden"><br>
This is text inside the division
<img src="penga.jpg"><br>
That was a picture inside the division. You can put a lot of things in a division.
</div>
And you see...
Example 5: inherit - making everything after conform
In the head:
<style type="text/css">
div.inherit {background-color:#00FFFF; width:150px; height:150px; overflow: inherit}
</style>
In the body:
<div class="inherit"><br>
This is text inside the division
<img src="penga.jpg"><br>
That was a picture inside the division. You can put a lot of things in a division.
</div>
And you see...
This is text inside the division

That was a picture inside the division. You can put a lot of things in a division.
I'm not sure entirely what "inherit" does, but it might make everything below it in the document inherit the traits of the division.