将 div 中的文本与底部对齐

Question

我有两个相邻的 div，一个带有 float: right，另一个带有 float: left。左侧包含一张图像 (200x100px)，右侧的 div 应包含文本。我想让右侧的 div 文本从 div 的左下角开始，而不是从左上角开始，这可能吗？ 谢谢

Answer 1

您可以创建容器 position:relative 然后在里面创建一个 div position:absolute;底部：0；左：0；

<div style="position: relative; height: 300px; width: 300px; background-color: #f00;">
  <div style="position: absolute; bottom: 0; left: 0; right: 0; background-color: #00f;">
    This will be at the bottom!
  </div>
</div>

Answer 2

在跨度、段落或您要放置文本的任何内容上尝试此 css 规则：

vertical-align: bottom;

Answer 3

您可以尝试将以下 css 添加到您的 div 中：

 #rightDiv{
   display: table;
   vertical-align: bottom;
}