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

Question

我已经使用CSS创建了网页布局。 CSS和HTML可以在这里找到：http://pastebin.com/Gn25nM8G

我不得不使用什么似乎是一些时髦的技巧，以获得布局正确。具体来说，让我的两个内容块在正确的地方，我不得不使用这个CSS：

position: relative; 
top: -351px; 

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

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

Answer 1

如果您只是尝试重新排列元素，该怎么办？把所有东西都放在两列中，并将其中的每一个都浮动？

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

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

Answer 2

这可能是也可能不是最好的方法。

position: relative意味着您正在移动div，但原本div占用的空间仍然占用。

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

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

Answer 3

这里是我的方法。 jsFiddle

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