css 定位 - 水平对齐

Question

我正在为某人制作一个简单的摄影网站，但我一直在尝试找出水平定位。我将边距设置为左/右自动，位置设置为相对。它应该放在中间，不是吗？

我在中间有一个我想要的图片幻灯片，然后是我在右侧的导航。导航在正确的位置，但幻灯片与导航重叠，我不知道如何让它水平居中。

这是导航:

#nav {
    position: fixed;
    top: 22%;
    right: 1%;
    text-align: center;
}

流氓 slider :

#slider {
    background:#000;
    border:5px solid #eaeaea;
    box-shadow:1px 1px 5px rgba(0,0,0,0.7);
    height:400px;
    width:600px;
    margin: 100px auto 0;
    overflow:visible;
    position:relative;
}

slider 包含在包装器 div 中:

.wrapper {
    height: 100%;
    width: 55%;
    margin-right: auto;
    margin-left: auto;
    background: #eaeaea;
    padding-bottom: 150px;
}

如何才能做到这一点？

如果您需要更多信息，可以查看页面和源代码: bwphotog.com

Answer 1

子 .container 元素比其父元素 .wrapper 宽。如果您删除容器的 960px 宽度，它将集中显示。