<article>
  <img src="http://source.unsplash.com/5dCC3Rfwje0/150x150" alt="A raindbow colored liquid texture" />
  <p>This image floats left, which means these paragraphs wrap around it.</p>
  <p>Nulla vitae elit libero, a pharetra augue. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Curabitur blandit tempus porttitor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
</article>
img {
  width: 150px;
  height: 150px;
  float: left;
}

/* Prevent page disruption by setting the article to have a flow root context */
article {
  display: flow-root;
}

/* Presentational styles */
img {
  margin-inline-end: 1em;
}

p + p {
  margin-top: 1em;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.