CSS Tutorial

CSS Style

CSS Layout Style

CSS Float Style

CSS Reference

CSS Float and CSS Clear Property div Element Tutorial


CSS Float Property

CSS Float property set the element to wrap around left or right side from another element.

Property Value Description
float left
right
none
Set element to wrap left or side from another element.

Example Code:

<body>
	<div style="width:250px;">
		<p style="float:left;margin:5px;font-size:18px;"> Float </p>
		<p>This example is display wrap around left float style in the elements. the paragraph style font-size is 18 pixel are write.</p>
	<div>
</body>

Run it...   »

Example Result:

Float

This example is display wrap around left float style in the elements. the paragraph style font-size is 18 pixel are write.

CSS Clear Property

CSS Clear property clean the floating left or right side or may be both side wrap area.

So it's effect is next element start in next new line.

Property Value Description
clear left
right
both
none
specify of which floating side to clean.

Example Code:

<body>
	<div style="width:250px;">
		<p style="float:left;margin:5px;font-size:18px;"> Float </p>
		<p style="clear:both;">This example is display wrap around left float style in the elements. the paragraph style font-size is 18 pixel are write.</p>
	<div>
</body>

Run it...   »

Example Result:

Float

This example is display wrap around left float style in the elements. the paragraph style font-size is 18 pixel are write.