2

我想使用 CSS 获得特定的布局，如下所示，我不确定是否可能。div 中有一些居中的文本。在下面，还有另一个 div 里面有文本；我想做的是右对齐此文本，使其右边缘与上方文本的右边缘齐平。

使用 CSS，我不知道如何做到这一点。显然，以下方法不起作用，因为子标题将与容器右对齐。但是有什么技巧可以完成我想要的对齐吗？

<div style='text-align: center;'>这是一些标题文字</div>

<div style='text-align: right;'>副标题文字</div>

注意：强烈偏好直接使用 CSS（如果可能，不要使用 Javascript）。

注意#2：我不拘泥于上面的 HTML。我可以使用任何完成所述对齐的标记。

4

1 回答 1

6

@thirtydot 不，我对任何可以完成对齐的 HTML 都很满意。

那么试试这个：http: //jsfiddle.net/thirtydot/nU9Cj/

<div style='text-align: center'>
    <span style="position: relative">This is some headline text
        <span style='position: absolute; top: 100%; right: 0; font-weight: bold'>Sub-header text</span>    
    </span>
</div>

您可能想在 , 中添加一些padding-bottom内容div，以弥补由于绝对定位的子标题而损失的高度。

于 2012-05-11T23:40:19.600 回答