我正在网站上工作,当时我有四个部分,里面有各种div,但是第三部分的内容是第二部分的重叠内容,就像第二部分的高度不会自动调整为内容。
由于有很多代码,我很难在jsfiddle中展示整个问题,所以可以在www.nickcookweb.co.uk/test看到这个问题的实例,其中&#39 ;博客'标题部分与上一部分的服务网格重叠。
(PS。我知道还有很多其他问题......仍在研究它们,很可能会发布更多问题)
答案 0 :(得分:0)
你的所有.service
div都悬空了,从不清除它们。
您可以执行以下操作来解决它......
<div id="servicesGrid">
<div class="service"></div>
<div class="service"></div>
<!-- etc... -->
<div style="clear: both;"></div> <!-- Solution -->
</div>
默认情况下,div会扩展以适合其内容,float
会更改此行为。如果没有明确的话,它会假装那些浮动元素甚至不存在。我们可以通过在最后一个浮动元素之后执行clear: both;
来解决和解决这个问题。
答案 1 :(得分:0)
我将servicesGrid的位置更改为静态,这似乎可以解决问题:
#servicesGrid {
position: static;
}
编辑:以下是有类似问题的人:Floats inside absolute positioned div