Html css-将img定位在h6下，不受h6尺寸的影响

我在模板中的

h6

下有一个

img

，并且我有此模板的多个外观

h6的

h6

大小可以是一行、两行等。目前我有

img

css，如下所示：

ul.hourly li img {
    padding-top: 20px;
}

问题很明显，如果其中一个模板的

h6

大小为2行，而另一个模板的

img

大小为1行，则

img

的高度将不相同

---

无论

h6

大小如何，如何将

img

固定在一个位置？

您可以将

h6

和

img

添加到同一容器中，并给它

位置：相对
，然后根据以下内容定位
img
：

<div class="container">
   <h6>My title</h6>
   <img src="image.png"/>
</div>

因此，
img
将始终位于容器底部。
寻求代码帮助的问题必须包含在问题本身中重现所需的最短代码，最好是在一个容器中。看到了吗？你有没有试着给图像定一个固定的高度
.container {
   position: relative;
}

.container img {
   position: absolute;
   top: 100%;
}