首页 > Web开发 > 详细

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

时间:2016-01-31 01:44:12      阅读:174      评论:0      收藏:0      [点我收藏+]
在一个大的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可解决

原文:http://www.jb51.net/css/89662.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!