3

私はこれらの要素を持っています:

<div id="button1"></div>
<div id="button2"></div>
<div id="big"></div>

...次のように表示する必要があります。

|------------------|  |---------|
|                  |  | button1 |
|                  |  |---------|
|                  |
|       big        |
|                  |
|                  |  |---------|
|                  |  | button2 |
|------------------|  |---------|

CSS を使用してボタンを大きな の上下に揃える最もクリーンな方法は何divですか? 大きなサイズを変更できるようにしたいdiv。また、大きなボタンとボタンの間のスペースdivはピクセル単位で一定です。

ラッパー要素を追加しても問題ありませんが、追加する必要がない方が望ましいです。とにかく、ラッパー要素でそれを行う方法もわかりません:(

4

2 に答える 2

5

「大きな」ボックス内にボタンを配置します。

<div id="big">
    <div id="button1"></div>
    <div id="button2"></div>
</div>

次のように、コンテナを基準にしてボタンを配置できます。

#big {
    position:relative;
    width:400px; height:400px;
    overflow:visible;
} #button1, #button2 {
    width:100px; height:50px;
    position:absolute;
    right:-120px;
} #button1 {
    top:0px;
} #button2 {
    bottom:0px;
}

これがフィドルです：http： //jsfiddle.net/Rcnbk/1/

秘訣は、親の位置：相対と子の位置：絶対を設定することです

于 2012-04-04T00:41:59.023 に答える
0

左側の列に2列のレイアウトbigdivを作成し、右側の列にボタン1divフィラーdivとボタン2divを作成します。

ラッパーチュートリアル：http ：//www.communitymx.com/content/article.cfm？cid = A8BBA

|------------------|  |---------|
|                  |  | button1 |
|                  |  |---------|
|                  |  |---------|
|       big        |  | filldiv |
|                  |  |---------| 
|                  |  |---------|
|                  |  | button2 |
|------------------|  |---------|
于 2012-04-04T00:39:48.670 に答える