css - 图像根据其下方的文本移动

Question

为什么我的图像会根据图像下方的内容移动？我对每个描述都有不同数量的文本，但图像会根据行数来回移动？

 <div>
      <img src="img">
      <p>one line</p>
 </div>
 <div>
      <img src="img">
      <p>two lines of text</p>
 </div>




 <style>
     div {
          display:inline-block;
          width:150px;
          text-align:center;
     }
     img {
        display:block;
        margin:0 auto;
     }
     p {
        padding-top:10px;
      }
  </style>

Answer 1

我需要一个 float:left 而不是使用内联。