/    /  CSS Float

CSS Float

 

The CSS float property is a positioning property. It is used to push an element to the left or right.

 

CSS Float

 

CSS Float Property Values:

 

none – The element does not float. This is the default.

left – Float the element to the left.

right –  Float the element to the right.

initial – Property to its initial value.

inherit – Property from its parent element.

 

CSS Float Property Example:

 

<!DOCTYPE html> 
<html> 
<head> 
<style> 
img { 
  float: right; 
} 
</style> 
</head> 
<body> 
<p>  <b>float:right</b>. </p> 
<img src="good-morning.jpg" alt="Good Morning Friends"/>
<p>
 Enter text here.Enter text here.Enter text here.Enter text here.Enter text here.Enter text here.Enter text here.Enter text here.Enter text here.Enter text here.
</p> 
</body> 
</html>

 

 OUTPUT:

 

CSS Float

 

Another Example:

 

<!DOCTYPE html> 
<html> 
<head> 
<style> 
img { 
  float: left; 
} 
</style> 
</head> 
<body> 
<p>  <b>float:left</b>. </p> 
<img src="good-morning.jpg" alt="Good Morning Friends"/>
<p>
 Enter text here.Enter text here.Enter text here.Enter text here.Enter text here.Enter text here.Enter text here.
</p> 
</body> 
</html>

 

OUTPUT:

 

CSS Float