0

すべてのブラウザーと画面の解像度で div を中央に配置することを検討しています。左 50% の div 幅の margin-left は非常に一般的ですが、div を含む div で完全にラップすると、div の背景が切り取られます。

私の div は画面全体に広がり、明るい灰色の背景にコンテンツを含む内側の div が表示されます。

パーセンテージとピクセルを使用してみましたが、1920 幅と 1200 幅の両方で中央に配置できません。

css は次のとおりです。

#default-upper-strap {

background-color: #ddd;
width: 109.61%;
margin-top: 25px;
z-index: 99999;
position: relative;
overflow: hidden;
padding-left: 23px;
margin-left: -8px;
max-width: 1920px;
}

#default-strap-left {
width: 810px;
height: 100%;
float: left;
margin-left: 21%;
}
4

1 に答える 1

0

次のことから始めてみませんか。

<div class="default-upper-strap">
    <div class="default-strap-left">Some content...</div>
</div>

body {
    margin: 0;
}
.default-upper-strap {
    background-color: #ddd;
    width: 100%;
    max-width: 1920px;
    margin: 25px auto 0 auto;
    padding-left: 0px;
}
.default-strap-left {
    width: 810px;
    height: 100%;
    margin: 0 auto;
    border-top: 1px dashed blue;
}

margin: 0 auto親コンテナ内で子要素を中央に配置するために使用します。

親コンテナが最大幅に達するmargin: 25px auto 0 autoと、必要に応じてルールが親コンテナを中央揃えにします。

デモを参照してください: http://jsfiddle.net/audetwebdesign/JqxY8/

于 2013-09-09T14:07:12.307 に答える