html - css - 中心对齐的 3 列布局，固定宽度的 l&r 列，流体中心

Question

我在包装器内有一个 3 列布局。左右两列的宽度是固定的:180px。中心列在 640px 和 960px 之间流动。我正在使用 calc 方法来计算它的宽度:

width: calc(100% - 360px);
max-width: 960px;
min-width: 640px;

但我想不通的是包装器的 CSS。如何让整个 3 列布局在浏览器中心对齐？

Answer 1

你可以这样做:

#wrapper {
  margin:auto;
  max-width:1320px; /*960 + 360*/;
  min-width:1000px; /*640 + 360*/;
}

查看此演示 http://jsfiddle.net/VTX4q/10/

_{我更改了尺寸以获得更好的可视化效果，但这是您可以使用自己的值进行操作的基础}

---