CSS Float 

<!DOCTYPE html>
<html>
<head>
  <title>CSS Float Example</title>
  <style>
    .container {
      width: 500px;
      border: 1px solid #ccc;
    }
    
    .box {
      width: 200px;
      height: 200px;
      border: 1px solid #000;
      float: left;
      margin: 10px;
    }
  </style>
</head>
<body>
  <div class="container">
    <div class="box">Box 1</div>
    <div class="box">Box 2</div>
    <div class="box">Box 3</div>
  </div>
</body>
</html>

Code Output

CSS Float

It is used to specify the positioning of an element in relation to surrounding elements. It allows you to float an element to the left or right of its containing element, causing other elements to wrap around it.

 

    • left: The element will float to the left, and the content will flow around it on the right side.
    • right:  The element will float to the right, and the content will flow around it on the left side.
    • none: The default value. The element will not float, and the content will flow as usual.