0

我试图将容器的高度从 527px (这是桌面背景的高度)更改为隐藏背景图像并在移动设备上使背景颜色拉伸到 div 的底部。clearfix 是从引导程序处理的。我的 .partbackdrop 类中有几个浮动 div 没有显示,因为它们太长了。无论我如何更改@media 上的#PartCarContainer,除了将其设置为固定值外,它都不会相应调整并将背景拉伸到 div。

链接已删除。问题解决了。将容器内所有 div 的高度设置为自动。

CSS

#PartCarContainer { background-color: #FFFFFF; -webkit-box-shadow: 0 2px 10px rgba(0,0,0,.25); box-shadow: 0 2px 10px rgba(0,0,0,.25); border-radius: 3px; overflow: visible; }
.partbackdrop { background-image: url(../../_common/img/backdrop.jpg); background-position: top center; height: 527px; }

@media (max-width: 767px) { 
#PartCarContainer { height: auto; }
.partbackdrop { background-image: none; }
}

HTML

<div id="PartCarContainer">
<div class="partbackdrop">
    Content
<div class="clearfix"></div>
</div>
</div>

编辑:由于页面的浮动,这可能是一个浮动问题。我也相信页脚可能会遇到同样的问题。如果您将窗口缩小到 767px 以下,您将看到红色背景,这是我的问题。

4

1 回答 1

0

你需要一个height:auto开启.partbackdrop.partDivMain

.partbackdrop, .partDivMain { height:auto; }
于 2013-05-24T17:45:39.640 回答