html - 内容太长时如何换行？

标签 html css

img {
  width:20%;
}

.shopInfoL2 {
  display:inline-block;
  vertical-align:top;
}

h4 {
  color:red;
  }

<h4>Div 1</h4>
<div>
  <img src="https://s.yimg.com/xd/api/res/1.2/2A8.GbmWTAlpFOqZFY.Leg--/YXBwaWQ9eXR3YXVjdGlvbnNlcnZpY2U7aD00MDA7cT04NTtyb3RhdGU9YXV0bzt3PTQwMA--/http://nevec-img.zenfs.com/prod/tw_ec05-7/71eb3ae4-2784-4a9c-a3fa-6985fd12a43f.jpg" alt="" class="imgQRL2"> 
  <div class="shopInfoL2">
    <h5>Title here</h5>
    <p>address address  </p>
  </div>
</div>
                         
                         
<h4>Div 2</h4>                         
<div>
  <img src="https://s.yimg.com/xd/api/res/1.2/2A8.GbmWTAlpFOqZFY.Leg--/YXBwaWQ9eXR3YXVjdGlvbnNlcnZpY2U7aD00MDA7cT04NTtyb3RhdGU9YXV0bzt3PTQwMA--/http://nevec-img.zenfs.com/prod/tw_ec05-7/71eb3ae4-2784-4a9c-a3fa-6985fd12a43f.jpg" alt="" class="imgQRL2"> 
  <div class="shopInfoL2">
    <h5>Title here</h5>
    <p>address address address address address address address address address address address address address address  </p>
  </div>
</div>

这里有两个div，唯一不同的是p标签的内容长度。

从结果可以看出，Div2 中的 p 长度太长，Div2 向下移动到 Div1。

如何使 Div2 始终紧挨着 Div1，并且当内容太长时 p 标签将切换为换行符？

最佳答案

设置宽度为你的 div .shopInfoL2

关于html - 内容太长时如何换行？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31782782/