4

私には2つのdivがあり、それらは別のdivの内側で互いに真上に配置する必要があります。簡単です。z-indexを使用して、position:absoluteを指定します。ただし、これらの各divの内容は垂直方向に揃える必要があります。それらを上に配置すると、垂直方向の中央に配置されません。

これを行うためにこれらのスタイルの両方を混合する方法はありますか?

それとも、これはjQueryでどういうわけか可能ですか?

これは基本的に私が持っているものです。

<div style="width:100%">
  <div style="height:400; width:400; display:table-cell; vertical-align:middle; z-index:0; position:absolute;"><img></div>
  <div style="height:400; width:400; display:table-cell; vertical-align:middle; z-index:1; position:absolute;"><img></div>
</div>

私は高さと幅、テーブルセルと垂直整列を中央に持っています。これにより、z-indexが機能するために必要な絶対位置を追加するまで、コンテンツが中央に配置されます。

何か案は?ありがとう、

4

4 に答える 4

4

あなたの内側のdivを与えるline-height:400px;

http://jsfiddle.net/2DXPg/1/

于 2012-05-22T21:57:12.040 に答える
2

2番目の中にextra-divを追加できます:http://jsfiddle.net/MDJDx/

<div style="width:100%">
  <div style="height:400px; width:400px; display:table-cell; vertical-align:middle; z-index:0; position:relative;top:0;">img</div>
  <div style="height:400px; width:400px; z-index:1; position:absolute; top:0">
    <div style="height:400px; width:400px; display:table-cell; vertical-align:middle; position:relative;">img</div>
  </div>
</div>
于 2012-05-22T22:03:56.533 に答える
1

2つの内側のdivを次のようにスタイリングします

position: relative; top: 0px;

あなたがすでに持っているものに加えて

于 2012-05-22T21:41:03.857 に答える
0

追加

margin: auto;

中央に配置したいコンテンツを含むdivに移動します。これを機能させるには、このdivにも幅を設定する必要があります。

多分

width: 100%;

トリックを行う必要があります。

于 2012-05-22T21:39:12.437 に答える