Copyright © tutorialspoint.com

CSS - overflow

previous next


Advertisements

Description:

The overflow property determines how content which overflows its element's content area should be handled.

Possible Values:

Applies to:

All the HTML elements

DOM Syntax:

object.style.overflow="scroll";

Example:

Here is the example:

<style type="text/css">
.scroll{
	display:block;
	border: 1px solid red;
	padding:5px;
	margin-top:5px;
	width:300px;
	height:50px;
	overflow:scroll;
	}
.auto{
	display:block;
	border: 1px solid red;
	padding:5px;
	margin-top:5px;
	width:300px;
	height:50px;
	overflow:auto;
	}
</style>
<p>Example of scroll value:</p>
<div class="scroll">
I am going to keep lot of content here just to show
you how scrollbars works if there is an overflow in
an element box. This provides your horizontal as well
 as vertical scrollbars.
</div>
<br />
<p>Example of auto value:</p>
<div class="auto">
I am going to keep lot of content here just to show
you how scrollbars works if there is an overflow in
an element box. This provides your horizontal as well
as vertical scrollbars.
</div>

This will produce following result:

Example of scroll value:

I am going to keep lot of content here just to show you how scrollbars works if there is an overflow in an element box. This provides your horizontal as well as vertical scrollbars.

Example of auto value:

I am going to keep lot of content here just to show you how scrollbars works if there is an overflow in an element box. This provides your horizontal as well as vertical scrollbars.

To Become more comfortable - Do Online Practice


previous next

Copyright © tutorialspoint.com