css - 絶対位置とフロート左/右

Question

これは明らかに矛盾しています。私が必要とするのは、2 つの子要素を親要素の左端と右端に配置し、垂直方向の中央に配置して、他のすべての兄弟要素の上に重ねることです。

Answer 1

leftそのためにとを使用できますright。

.child
{
    position: absolute;
    top: 50%;
}

.child .left
{
    left: 0;
}

.child .right
{
    right: 0;
}

top: 50%は、子の上端を親の半分まで揃えます。親のサイズが一定の場合は、ピクセル サイズを使用します。それ以外の場合は、正確に正しくするには、おそらく JavaScript が必要になるでしょう。

コメントに応じて編集：

ページではなく親に対して相対的にするには、親を与える必要がありposition: relative;、それは機能します。デフォルトの位置はstaticであり、これでは機能しません。

Answer 2

私が正しく理解していれば：

<div class="parent" style="position:absolute;height:70%;width:70%;top:15%;left:15%;background-color:#eee;border:solid blue 1px;">
    <div class="left" style="position:absolute;width:30%;height:70%;top:15%;left:0%;background-color:black;z-index:20;">left box vertically aligned</div>

    <div class="right" style="position:absolute;width:30%;height:70%;top:15%;left:70%;background-color:black;z-index:20;">right box vertically aligned</div>
</div>​

参照: http://jsfiddle.net/dankpiff/zmYEf/

下の要素を低い z-index で設定すると、それらは「左」と「右」のボックスで覆われます

これはあなたが意味するものですか？