html - 在调整大小时，我缺少什么来阻止我的图像崩溃？

Question

我得到了 3 张(很快就会变成 5 张)彼此相邻的照片。当我调整浏览器大小时，图像变成了这个很小的 ​​1px x 1px 大小。我怎样才能防止这种情况发生？我觉得这应该很简单，但我不知道要更改什么..

HTML:

<div class="inUseDescription">
    <p style="font-size: 24px;">text text text text text text</p>
<div class="images">
    <img src="image.jpg" width="170" height="150">
</div>
<div class="images">
    <img src="image.jpg" width="170" height="150">
</div>
<div class="images">
    <img src="image.jpg" width="170" height="150">
</div>
</div>

CSS:

.inUseDescription {
    padding: 65px;
    display: inline-block;
    max-width: 62%;
    color: white;
}

.images {
    float: left;
    width: 22%;
    padding: 10px;
}

Answer 1

为 .images 添加最小宽度

.images {
  float: left;
  width: 22%;
  padding: 10px;
   min-width: 170px;
}