How to wrap text around an image using HTML and CSS?

Spread the love

Sometimes, we want to wrap text around an image using HTML and CSS.

In this article, we’ll look at how to wrap text around an image using HTML and CSS.

How to wrap text around an image using HTML and CSS?

To wrap text around an image using HTML and CSS, we set the float property.

For instance, we write

<div id="container">
  <div id="floated">...some other random text</div>
  ... some random text ...
</div>

to add a div inside a div with text.

Then we write

#container {
  width: 400px;
  background: yellow;
}

#floated {
  float: left;
  width: 150px;
  background: red;
}

to add float: left; to the div with ID floated to make the text outside the div wrap around the div with ID floated.

Conclusion

To wrap text around an image using HTML and CSS, we set the float property.

Leave a Reply

Your email address will not be published. Required fields are marked *