html - 在绝对位置内水平对齐文本

Question

我正在尝试画出一个盒子。在这个盒子里，我想在左上角和右上角放置一些元素，然后在它下面绘制额外的元素，紧贴盒子的底部，但不再在 Angular 落里。

在左下角元素的情况下，我希望它在左列/框的一半内居中，而我希望右下角元素在其右列/框的一半内右对齐。

我在 http://jsfiddle.net/7GeAM/2/ 创建了一个 jsfiddle来说明我的意思。我使用了 position:absolute;bottom:0 以便将底部文本与框的底部对齐，但是文本对齐属性似乎不再执行任何操作。

我该怎么做才能再次实现这些对齐？谢谢!

编辑:我更新了 jsfiddle 以使用样式表。目标是保留文本在每一列底部的位置。在左下角，我希望将文本置于其列的中心。在右下角，我希望右对齐文本，也在其列内。

Answer 1

您需要为 div 指定宽度以使文本对齐起作用。例如，您可以让它们各自占据盒子宽度的一半:

.bottom-left {
    left: 0;
    right: 50%;
}

.bottom-right {
    left: 50%;
    right: 0;
}

http://jsfiddle.net/N6v6W/