Html 如何使内联块中显示的文本换行并增加父容器的高度？

我有一个图像，旁边是一个div，有两个子div。两个div的图像和容器都显示在内联块中。两个div包含一行文本。如果文本溢出，我希望父div的高度增加，但是相反，文本行被推到图像下方。这里有两个例子。在第一种情况下，文本与图像正确对齐。在第二种情况下，文本被推到图像下方，因为它溢出了

.w-165{
宽度：165px；
}
.软边{
边框：实心1pxRGBA（76,84,98,0.3）；
}
.h-70{
高度：70像素；
}
.d-内联块{
显示：内联块；
}
.中间对齐{
垂直对齐：中间对齐；
}

通知
新发行
12月15日
这里最简单的方法是为所讨论的
div
定义一个宽度。这将强制文本换行

width: 60px;

许多解决方案中的一种是为图像和文本容器使用表格布局，因此将此添加到CSS中：

.w-165 > div:last-child {
  display: table;
}
.w-165 > div:last-child > * {
  display: table-cell;
}

请参见下面的演示：


.w-165{
宽度：165px；
}
.软边{
边框：实心1pxRGBA（76,84,98,0.3）；
}
.h-70{
高度：70像素；
}
.w-165>分区：最后一个孩子{
显示：表格；
}
.w-165>分区：最后一个孩子>*{
显示：表格单元格；
}
.d-内联块{
显示：内联块；
}
.中间对齐{
垂直对齐：中间对齐；
}

通知
新问题
12月15日
我试图调整代码以使其按您的要求工作，请检查

CSS

我必须为
div
s添加宽度以使文本换行，当然，使用此解决方案，如果您输入的单词太长，它将退出
div

.h-70{
  width: 95px;
}

.d-inline-block div{
  width:60px;
}

如果有用请告诉我，谢谢