css - 在浏览器中居中不对称 div

Question

我有一个主 div（宽度：960px），它位于浏览器窗口的中心，带有“margin：0px auto”。有时我想在主 div 的右侧展示一个广告（160x600，左边距可能为 10 像素），但主 div 应始终保持在浏览器的中心。

我怎样才能做到这一点？

Answer 1

您可以将广告放在 centered 内div，使 centered div position:relative，广告position: absolute并left根据需要进行设置：http: //jsfiddle.net/3vqh8/1/

#center {
    background: blue;
    width: 960px;
    height: 600px;
    margin: 0 auto;
    position: relative;
}

#ad {
    position: absolute;
    height: 600px;
    width: 160px;
    background: red;
    right: -170px;
}

Answer 2

尝试将主 div 定位为相对，将广告 div 定位为绝对。

使用顶部和左侧来调整位置。

（不确定它会起作用，制作一个 jsfiddle 向我们展示您的案例）

Answer 3

如果您的主容器已经居中，只需像主容器的第一个内部元素一样放置新的分隔线，然后将其绝对定位为“向左移动”位置。

<div class="main-container">
    <div class="new-left-publicity"></div>
    <div class="what-was-there-before"></div>
</div>