当包含正确大小的 DIV class 大小正确时，如何纠正不成比例地拉伸的图像？

Question

我目前正在研究时间线模块（Elementor/Wordpress），虽然图像上传正确，在 Wordpress 画廊中正确显示，并在那里显示正确的比例，但最终显示错误。

div class 是<div class="eael-content-timeline-img eael-picture">并且在 Inspector 中我可以在它上面使用 hover 并查看尺寸是否正确（在本例中为 60x60）。 但是，当我在 img src 上进行 hover 时，我可以看到尺寸是倾斜的（60x24），我不确定这些数字来自哪里，因为这不是我通过构建器设置的。

Chrome Inspector 的拉伸屏幕截图和我的视图

Answer 1

为确保图像的纵横比得到保留并且图像不会被拉伸，请应用以下CSS ，以div内的img为目标：

.eael-content-timeline-img img {
  width: 100%;
  height: auto;
}