1

質問が重複していることをお詫びしますが、他の質問に対する回答はどれも私の問題を解決していないようです。divページの中央にを揃えたいのですが。は、そのdiv中のコンテンツと同じ幅である必要があります。モーダルポップアップとして使用されます。ここでjsFiddleを設定しました:http://jsfiddle.net/PDzNj/11/

div左側を中央ではなく中央に揃えます(divこれは望ましい効果です)

助けてくれてありがとう

4

1 に答える 1

7

1つのオプションは、<div>'の周囲でテーブルをエミュレートすることです。

<div class='outer'>
    <div class='inner'>
        <div class='thebox'>Contents</div>
    </div>
</div>

そして、CSSを使用します。

div.outer {
    display:table;
    width:100%; //Or however wide you want the container to be
}
div.inner {
    display:table-cell; //This allows the use of vertical-align
    vertical-align:middle;
    text-align:center;
    width:100%;
}
div.thebox { //Your variable-width container
    display:inline-block; //Makes it obey text-aligning.
}

もちろん、必要に応じて高さの値を追加できます。これは、相対的なものにしたり、マージンを使用したりするよりも、CSSの面で優れており、周囲の混乱も少なくなります。

于 2012-05-25T14:15:59.033 に答える