我是 CSS 的新手，如果这是一个真正愚蠢的问题，请原谅我! 但问题是，过去 48 小时我一直在尝试这个，但仍然无法正确完成。我想要的只是一个 CSS 布局:

两列，左侧流动，右侧固定 (300px)
两列的高度相同，右列始终具有背景色。
100 像素高度的标题。
300 像素高的页脚。
整个东西封装在一个中心位置的容器中。此容器的最大宽度为 960 像素，最小宽度为 480 像素。当屏幕小于 480 像素时，固定的右侧栏应垂直位于左侧内容栏下方。
应该在 IE 7+、Chrome、Safari、FF 中工作。
没有 JavaScript(无法理解为什么需要这样做)

我已经尝试(并且仍在尝试)这样做，但不知何故无法创建相同的高度列。我尝试了一些在线 CSS 生成器，但没有成功。将不胜感激任何帮助、指示等。

编辑:

这是一个 jsfiddle:'http://jsfiddle.net/GKEmA/' 我所做的

最佳答案

您可能想尝试使用 CSS 表格布局 — 不是 HTML 表格标记，只是 CSS 属性。 float 并不是真正为布局而设计的。

关于具有等高列的 CSS Fluid-Fixed 布局，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/13248699/

具有等高列的 CSS Fluid-Fixed 布局