CSS重叠div的

Question

我有4个div：

#centered {
    position: absolute;
    top: 50%;
    left: 52%;
    width: 500px;
    height: 500px;
    margin-top: -250px; /* Half the height */
    margin-left: -250px; /* Half the width */
    }
#container{
    width:100%;
}

（左右都在此容器中）

 #left{
        float:left;
        width: 260px;
        height: 600px;
    }
    #right{
        float: right;
        top: 50%;
        width: 160px;
        height: 600px;
    }

居中的div始终位于页面的中心，其他两个位于页面的两侧。 使用

body { min-width:1150px; }

在#centered和#right之间总是有一个空格。 但是当我缩小页面时，＃居中和＃左之间没有保留空间，导致重叠。 我怎样才能做到这一点？

Answer 1

您可以添加装订线<div>并相应地调整位置，也可以减小#left的宽度。 在#left和#right的宽度上使用百分比而不是px可以使调整大小时更加平滑。