Home Whiteboard Graphing Calculator Online Compilers Articles Tools
Tutorials Courses Jobs

Clear the float of an element with Bootstrap

HTML Bootstrap jQuery Javascript

To clear the float of an element, use the .clearfix Bootstrap class.

Example

You can try to run the following code to clear float of an element

<!DOCTYPE html>
<html>
   <head>
      <title>Bootstrap Example</title>
      <link href = "/bootstrap/css/bootstrap.min.css" rel = "stylesheet">
      <script src = "/scripts/jquery.min.js"></script>
      <script src = "/bootstrap/js/bootstrap.min.js"></script>
   </head>
   <body>
      <div class = "clearfix" style = "background: orange;border: 1px solid #000; padding: 10px;">
         <div class = "pull-left" style = "background: blue; color: white;">
            left
         </div>
         <div class = "pull-right" style = "background: blue; color:white;">
            right
         </div>
      </div>
   </body>
</html>
Updated on: 2026-03-11T22:50:42+05:30

628 Views

Learn More in Our Tutorials

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements