Bootstrap 4 图像流体不缩放颜色大小

我找不到关于以下问题的最新答案：当我尝试使用响应图像（使用

class=“img fluid”

）时，它会拉伸一个荒谬的高度，但保持正确的宽度

我正在尝试的是：

<div class="row">
    <div class="col-4">
       <div class="col-12">
          <div class="row">
             <div class="col-md-4">
                <div class="row">
                   <img src="https://via.placeholder.com/150" class="img-fluid">
                </div>
             </div>
             <div class="col-md-8">
                <h3>
                   <small>Brand</small><br />
                   Product name
                </h3>
             </div>
          </div>
       </div>
    </div>

品牌

产品名称

---

此问题会影响除firefox之外的所有浏览器。

您嵌套的列之间没有所需的行。这可能没有关系，但我会解决的。（我不认为col-12元素有任何作用。）是的，有许多不必要的代码，比如包装图像的

.col-12

和

.row

。我删除了它们并在其外部添加了一个容器：。仍然不确定你所说的图像延伸到荒谬的高度是什么意思。我认为你解决了这个问题。我经常使用额外的12列来创建边距/使用外部列作为阴影。