中心div，但对于较小的尺寸使用左

Question

所以我的布局如下：

• 左栏，width: 200px; left: 0;
• 中心，width: 700px; left: 250px;
• 对，width: 200px; right: 10px;

这是有效的，但是对于更大的屏幕尺寸，我希望中心能够很好地居中。但是，无论大小，我总是希望至少 left: 250px

我怎样才能做到这一点？

Answer 1

您可以使用CSS媒体查询来实现此目的：

@media screen and(min-width: 1001px){
    .center{
        margin: auto;
    }
}

@media screen and(max-width: 1000px){
    .center{
        left: 250px;
    }
}

Answer 2

Marcel提出的CSS媒体查询可能是最好的解决方案。为了将来参考，通常响应式Web开发需要使用％而不是像素来调整屏幕尺寸差异。

大约 - ＆gt;

Left { width: 17%; left: 0; min-width: 250px; /*margin-right: 50px;*/ }
Center { width: 65%; left: 20%; position: absolute; }
Right { width: 17%; right: 10px; }