html - 是什么导致使用 960 网格系统的 div 中出现额外空间和随机对齐？

Question

我有一个问题，div 中的元素看似随机对齐，不响应任何对齐标记，并且 div 在其元素上方或下方创建额外空间。我使用的是 960 网格系统，我没有更改现有的 CSS 文件，以免我的手指弄坏它。

我已经放了一个测试页here , 请原谅一些狡猾的代码:-D

它仍处于非常早期的阶段(我也是)，但我觉得在我能够轻松理解导致问题的原因之前我不能继续前进。

该页面上最好的例子是底部的水平条和下面的元素。该栏添加了几个像素的死空间，并且其下方的元素与其各自 div 的不同部分对齐。

为什么在没有给出指令的情况下，元素似乎没有标准化它们的对齐方式，是什么导致在没有给出指令的情况下再次出现额外的空间？

我自己的想法是相对独立地放置所有内容，但我担心这会导致问题并“破坏”网格。除此之外，我不知道。

谢谢

Answer 1

其中一个问题是 #horizo​​ntal-bar-footer 的高度为 25px，超过了 hr 行的需要。将 height 设置为 0px，然后添加一些 padding-bottom 使页脚上方有一点空间。

这应该会带来“由 tom rankin himself 设计”的部分。对于 Facebook 点赞按钮，将其添加到 main.css:

.fb_iframe_widget span {
    vertical-align: top;
}