Edit

Float Left Example

The float left property is used to put the positioning of HTML content in left side.

Example of Code

<style type="text/css">
    .float-left {
    float: left;
    padding: 20px;
    margin: 0 10px 10px 0;
    background: gold;
  }
</style>
<body>
    <div class="float-left">
      Float left
    </div>
    <p>This text rearranges itself to flow around the element that is floated left. </p>
    <p>I added a margin to the right and bottom of the floated box so that this text doesn't run right up against it. Play around with the property values to see how it changes the layout.</p>
</body>

Output

   
      Float left   
   

This text rearranges itself to flow around the element that is floated left.

   

I added a margin to the right and bottom of the floated box so that this text doesn't run right up against it. Play around with the property values to see how it changes the layout.