所以我正在尝试一个简单的布局。这是一个很多照片的采访布局。
这是我遵循的基本概念：
-intro
-photos
-interview
我正在为<div id="interview">设置一个保证金顶部，但它不起作用。为什么？我认为我的布局结构存在问题。（如果你点击chrome中的inspect元素）
如何解决这个问题？链接：http://mysecretathens.gr/kulte_test/osterman.html
答案 0 :(得分：2)
这是因为您没有清除浮动元素，只需在声明<div id="interview">之前清除浮动，然后再使用margin-top: /* Whatever px */
<div style="clear: both;"></div>
<div id="interview">
查看您的网站时，您在着陆页上使用了大量图片，这会让所有带宽不足的用户感到恼火，建议您查看lazy loading
答案 1 :(得分：2)
解决此问题的一种简洁方法是在照片元素中添加“overflow：hidden”。
#photos {overflow:hidden;}
答案 2 :(得分：1)
它“不起作用”，因为上面的所有图像都是浮动的 - 因此不会超出其父元素的高度。
将overflow:hidden添加到您的#photos div中，以便它包含所有图片并且不会浮动它们 - 然后以下元素的margin-top将按预期工作。< / p>