使用CSS的页面布局 - 这是完成此布局的最佳方法吗？

Question

我使用CSS创建了一个网页布局。可在此处找到CSS和HTML：http://pastebin.com/Gn25nM8G

我不得不使用看起来像一些时髦的技巧来使布局正确。具体来说，为了让我的两个内容块在正确的位置，我必须使用这个CSS：

position: relative;
top: -351px;

我想知道是否有更好的方法来完成这种布局？

我也不确定为什么页面末尾会有很大差距？如果你从我的代码创建一个页面，你会看到我在说什么。任何帮助将不胜感激。

Answer 1

如果您只是尝试重新排列元素怎么办？把所有东西分成两列并浮动每一列？

这是一个快速的小提琴来说明我的意思：

http://jsfiddle.net/qh75H/3/

Answer 2

这是我的方法。 jsFiddle

我尽量保持你的代码和布局。

Answer 3

这可能是也可能不是最佳方法。

position: relative表示你正在移动div，但div占用的空间最初仍然被占用。

如果你想移动div，但为其他内容腾出空间，position: absolute可能会更好。

position: relative也可能导致空格，因为您“移动”的框可能仍占用空间，导致页面运行时间过长。