How to stop any element to be floated on the sides of paragraph element in CSS ?
In this article, we will learn How to stop an element from being floated on the sides of a paragraph element in CSS. The clear property is used to control an element from being floated on the sides of a paragraph.
Approach: The clear property is used to control an element from being floated on the sides of a paragraph. It takes direction from which we want to stop an element from being floated like: left, right, top, bottom, and both. So fix clear value to both to stop an element from being floated on the sides of a paragraph.
Syntax:
clear: none|left|right|both|initial;
Example:
HTML
<!DOCTYPE html><html> <head> <style> img { float: left; } p{ font-size: 30px; } p.gfg { clear: top; } </style> </head> <body> <img src="gfg_stiker.png" width="100" height="150"> <p>The image is flotted to the side of this paragraph.</p> <p class="gfg"> Now image is not gonna be flotted on the sides of this paragraph. </p> </body></html> |
Output:
Before applying clear property:
After applying clear property:
.png)
