Html 在底部放置div

我试图将

content desc

div放在

content box inner

的底部，但它没有放在那里，而是放在图像后面：

.content框内部{
位置：相对位置；
显示：内联块；
宽度：360px；
高度：460px；
背景色：#fff；
右边距：10px；
边框：1px实心#ddd；
溢出：隐藏；
}
.内容框内部>img{
宽度：200px；
边缘顶部：10px；
边框：1px实心#ddd；
填充：8px；
}
.内容标题{
位置：相对位置；
高度：35px；
背景色：#FFB400；
长方体阴影：0.15px rgba（0,0,0,0.3）
}
.content title>p{
文本对齐：居中；
线高：35px；
字体系列：verdana；
颜色：#222；
字体大小：粗体；
字母间距：0.02em；
文本转换：大写；
}
.内容描述{
位置：相对位置；
高度：50px；
底部：0；
左：0；
右：0；
}
.content desc>p{
字体系列：verdana；
字母间距：0.04em；
字体大小：15px；
填充：8px；
}

正文

一些文本

您是否尝试过使用

位置：绝对？添加
位置：绝对位置；底部：0应该可以解决您的问题。
更改

.content-desc {
position: relative;
...
}

到

您需要将.content desc设置为绝对定位：

.content-box-inner {
position: relative;
display: inline-block;
width: 360px;
height: 460px;
background-color: #fff;
margin-right: 10px;
border: 1px solid #ddd;
overflow: hidden;
}

.content-box-inner > img {
width: 200px;
margin-top: 10px;
border: 1px solid #ddd;
padding: 8px;
}

.content-title {
position: relative;
height: 35px;
background-color: #FFB400;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.3)
}

.content-title > p {
text-align: center;
line-height: 35px;
font-family: verdana;
color: #222;
font-weight: bold;
letter-spacing: 0.02em;
text-transform: capitalize;
}

.content-desc {
position: absolute;
height: 50px;
bottom: 0;
left: 0;
right: 0;
}

.content-desc > p {
font-family: verdana;
letter-spacing: 0.04em;
font-size: 15px;
padding: 8px;
}

请参见此处的小提琴链接：
刚刚解决了问题，我甚至没有注意到我已经写了
位置：relative
，我真傻。很高兴能帮上忙！：）最初吸引我注意这个问题的是，我昨天也有同样的问题！
.content-box-inner {
position: relative;
display: inline-block;
width: 360px;
height: 460px;
background-color: #fff;
margin-right: 10px;
border: 1px solid #ddd;
overflow: hidden;
}

.content-box-inner > img {
width: 200px;
margin-top: 10px;
border: 1px solid #ddd;
padding: 8px;
}

.content-title {
position: relative;
height: 35px;
background-color: #FFB400;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.3)
}

.content-title > p {
text-align: center;
line-height: 35px;
font-family: verdana;
color: #222;
font-weight: bold;
letter-spacing: 0.02em;
text-transform: capitalize;
}

.content-desc {
position: absolute;
height: 50px;
bottom: 0;
left: 0;
right: 0;
}

.content-desc > p {
font-family: verdana;
letter-spacing: 0.04em;
font-size: 15px;
padding: 8px;
}