三列布局，固定列

Question

我正在寻找带有页眉和页脚的三列布局（全屏）（非液体/流体设计）。即

• 当我调整浏览器大小时，我的内容不应该被替换。
• 另外，无论三列中的哪一个都是最长的页脚 来到底部。
• 最后，即使3列上没有内容填充页面，页脚也会在底部。

（还需要建议，哪种方法对于保持我的设计几乎在所有主要浏览器中都是有用的，是％（table，tr，td）， px 或 em ？）

换句话说，就像facebook一样。

Answer 1

如果您正在寻找3列设计，最好使用div元素并为每列使用一定的％。如果您在px或em中使用固定宽度，则在调整太多时可能会遇到麻烦（列移动到彼此之下）。但是，如果你使用百分比并调整大小，你会得到的问题也低于某个分辨率，但对于较大的分辨率，％通常会更完美。百分比方法的缺点是您不能总是按照您想要的方式布置页面，因为百分比会使列的宽度根据查看的屏幕而变化。

确保页脚位于列下方可以通过在最后一列上使用clear css标记，或在列之后但在页脚之前使用br元素来实现。

更新

底部为页脚的3列布局示例：http://puu.sh/9tga

示例包含3列，页眉，页脚：http://puu.sh/9tm6

固定页眉和页脚的示例：http://puu.sh/9toj

Answer 2

听起来你可以使用Twitter Bootstrap并使用3列布局（或在其他布局中选择）。