如何对齐来自不同div的文本以从同一行开始

时间:2019-06-24 14:43:11

标签: html css alignment

我有一堆带有display的div:inline-block 每个人都有一个图像和图像描述,我希望所有文本都从同一行开始

img {
  width: 300px;
}

.block {
  display: inline-block;
  width: 350px;
}
<div class="container">
  <div class="block">
    <img src="https://images.pexels.com/photos/248797/pexels-photo-248797.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500" />
    <div>
      This is a description
    </div>
  </div>
  <div class="block">
    <img src="https://images.unsplash.com/photo-1535498730771-e735b998cd64?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&w=1000&q=80" />
    <div>
      This is a description This is a description This is a description This is a description
    </div>
  </div>
  <div class="block">
    <img src="https://cdn.pixabay.com/photo/2018/10/30/16/06/water-lily-3784022__340.jpg" />
    <div>
      This is a description This is a description This is a description This is a description This is a description This is a description

    </div>
  </div>
</div>

但是在我的实现中,每个块中文本开头的行都不同:

rendere page

那么,有什么方法可以使文本从同一行开始(无论图像高度是多少)?

所有图像的属性都不同,因此高度不同(宽度相同)

0 个答案:

没有答案