如何始终将 div 保持在另一个 div 的底部

Question

目前，我有一些缩略图在悬停时显示有关它们的信息。信息包含在 figcaption 中，然后由 title div、maincaption p 和 footer p 组成。

由于每个主要内容 p 部分的大小各不相同，我想知道是否可以在所有缩略图中将页脚 p 保留在 figcaption 的底部，以确保它们彼此看起来均匀。

目前，由于 maincontent p 的大小不同，我为每个页脚 div 设置了多个 id，以便手动将它们全部对齐。

如有任何帮助，我们将不胜感激！

一个figcaption部分示例：

<figcaption class="caption">
<div class="captiontitle">Tracking Reel</div>
<p class="maincaption">Demonstrates different uses of image/motion tracking, including wire removal image replacement and rotoscoping. Attention to detail is key in this technique, a good eye essential.</p>
<p class="captionFooter">Adobe After Effects and Mocha were used.</p>
</figcaption>

一个 div CSS 示例：

.captionFooter
{
padding-top: 25px;
font-size: 16px;
}

我的理解是，我希望能够将一种样式应用于.captionFooter，该样式将应用于所有缩略图并将其保持在底部，而不是推动.maincaption 使其保持内联。

Answer 1

如果您想在 div2 的底部保留一个 div，请执行以下操作：

div{
  position: relative;
}

div2{
  position: absolute;
  bottom: 0;
}

这是工作小提琴：http://jsfiddle.net/KFuuL/1/