0

查看所有浏览器和屏幕分辨率的 div 居中。看到左边 50% 与 div 宽度的左边距很常见，但是将 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 回答