如何对齐此特定div图像和内容溢出

Question

图片和内容如何在此图片中对齐后跟内容。

Answer 1

.container {
  width: 50%;
}

.imgContainer {
  float: left;
  margin: 1em;
}

.imgContainer p {
  margin: 0;
  font-style: italic;
  font-size: 0.8em;
}

<div class="container">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam aliquam nisi vitae ultrices viverra. Donec egestas eu odio vitae vehicula. Donec vitae lacinia leo. Mauris in libero purus.
  <div class="imgContainer"><img src="http://placehold.it/100x50">
    <p class="imageNote">Note under img</p>
  </div>Cras interdum sapien tortor, non pretium tellus rhoncus quis. Nunc dapibus dignissim dolor ut bibendum. Curabitur in arcu consectetur, dignissim est eu, porta velit. In luctus purus eget elit placerat tempor. Quisque id ante sit amet lacus tincidunt
  lacinia.
</div>