How to lay out div under img with float?

Question

css

There is a picture with property float: left. Next to it, a span is displayed on the right with information such as first name, last name, etc. Then I need to place a div below the image. But it also wraps around the picture. How can I make the span wrap around the kariinka and the div be below it?

.user-header{
  font-weight: 500;
  color: #555;
  font-size: 20px;
}

.user-header img{
  width: 100px;
  height: 100px;
  border-radius: 100px;
  margin: 5px;
  float: left;
}

.user-header span{
  font-weight: normal;
  font-size: 16px;
}

Here's what it looks like now: cssdeck.com/labs/yebuh93c

Answer 1

https://jsfiddle.net/qfx9rhgm/1/
Clear: both;