DIV背景图片在Firefox下不显示通过overflow:auto可如何解决

盼什么没什么,怕什么来什么。那些忙于批评别人的人,都忘了检讨自己。生活就是这样,当你想昂着头走路时,你就得随时准备在地上趴着。
在一个大的div里有2个横列(DIV),并且在大的div里加入背景图片。可是改好后,在Firefox下却无法正确显示背景图片。代码是这样的:
1.HTML(样本):
复制代码
代码如下:

<div id="footer">
<div id="footer_left">Content1</div>
<div id="footer_right">Content2</div>
</div>

2. CSS:
复制代码
代码如下:

#footer {
width:730px;
background-image: url(../images/bg.jpg);
background-repeat: repeat-y;
}
#footer_left {
float:left;
width:230px;
}
#footer_right{
float:left;
width:500px;
}

此代码是左右两栏排版,利用父DIV(footer)的背景图片做子DIV(footer_left)的背景,来达到左右两栏高度对齐。
解决办法:
这是因为你的#footer_left 和#footer_right加了float:left,在FF里如果里面的元素加了float:left(right),它就不会被撑开的,也就是说的它的高度是0,如果正常显示,必须加上:overflow:auto,
即:
复制代码
代码如下:

#footer {
width:730px;
background-image: url(../images/bg.jpg);
background-repeat: repeat-y;
overflow:auto;
}

本文DIV背景图片在Firefox下不显示通过overflow:auto可如何解决到此结束。不要指望别人来帮你走路,不要指望谁能帮你挨疼。痛,要自己扛;伤,要自己愈。有些路不合脚,却必须走;有些选择不合心,却要知道适应。人只有经历过了不如意,才知道生活真的不容易。路是自己的,要走;心是自己的,要懂。所求越少,得到越多;心越简单,快乐越多。无谓于得,不计于失,才能真正体会到追求的快乐。小编再次感谢大家对我们的支持!

您可能有感兴趣的文章
css让页脚保持在底部位置的四种方案

CSS如何使用Flex和Grid布局如何实现3D骰子

Flex布局史上最简单使用语法教程

新的CSS 伪类函数 :is() 和 :where()示例详解

纯CSS打字动画的如何实现示例