A clearfix is a way for an element to automatically clear or fix its elements, so that do not need to add additional markup. It is generally used in float layout where elements are floated to be stacked horizontally. If the element is taller than the element containing it then use overflow property of CSS to overcome this.
In the above image logo is not fit into the div element. To fix this problem there are two ways. First is by increasing the height of the div block and second by the use of clearfix CSS property.
Example 1: In the code below problem is fixed without using overflow property.
Example 2: In this code, the problem is fixed using overflow property.
- Clearfix in Bootstrap
- Best Books to Learn Back-End Web Development
- Implementing Salting
- How to wait for a promise to finish before returning the variable of a function?
- How to choose a Technology Stack for Web Application Development ?
- How to see the extensions loaded by PHP ?
- How to redirect a page to another page in HTML ?
- When to use self over $this in PHP ?
- SASS | Placeholder Selectors
- How to generate a drop down list of timezone using PHP ?
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to email@example.com. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.