0

ラッパーまたは親コンテナーに対して div レイヤーを中央に配置する方法は知っていますが、ページ本体の div 内に div がある場合はどうでしょうか。本体に対して最小の div を中央に配置するにはどうすればよいですか?

<div id="1" style="width: 100%">
<div id="2" style="width: 22.5%; height: 1000000000px; margin-left: 12%;">
<div id="3" style="position: absolute;">
</div>
</div>
</div>

上記の例で、id="1" の div に対して id="3" の div を中央に配置するにはどうすればよいですか?

4

4 に答える 4

0

marging:0 autodiv id=3に設定

于 2013-01-28T08:27:42.060 に答える
0

#1である必要があり、幅の半分を左position: absoluteに#3設定left: 50%およびオフセットします

#d1 {
    position: absolute;
}

#d3 {
    position: absolute;
    left: 50%;
    width: 100px;
    margin-left: -50px;
}

遊ぶためのJSFiddle。

インライン スタイルを CSS パネルに移動し、ids をそれぞれd1,d2およびに変更しd3ました。

于 2013-01-28T09:00:40.323 に答える
-1 
div#2 {
  position: relative;
}
div#3{
    position: absolute;
    margin: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

div#3これにより、水平方向だけでなく垂直方向にも div#2 が中央に配置されます。また、ID に数字を使用できないことに注意してください。

div#3... を中心にしたい場合は、スタイルを からにdiv#1移動するだけです。position:relativediv#2div#1

于 2013-01-28T08:31:17.680 に答える
-1

画面の中央に正確に配置する場合は、ID#3 を 2 つの div で囲む必要があります。1 つは垂直方向の配置を処理し、もう 1 つは水平方向の配置を処理します。

<div id="vertical">
    <div id="horizontal">
        <div id="3" style="position: absolute;">
    </div>
</div>

詳細はこちら:デッドセンター

于 2013-01-28T08:35:54.063 に答える