手机
当前位置:查字典教程网 >网页设计 > Div+Css教程 >DIV背景图片在Firefox下不显示通过overflow:auto可解决
DIV背景图片在Firefox下不显示通过overflow:auto可解决
摘要:在一个大的div里有2个横列(DIV),并且在大的div里加入背景图片。可是改好后,在Firefox下却无法正确显示背景图片。代码是这样的:...

在一个大的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可解决】相关文章:

仿网易div+css滑动门选项卡效果

在ie7下css居中样式text-align:center;偏左问题解决方法

CSS复合选择器使用介绍

css body背景图全屏不论分辨率大小

css设置body背景图片随内容增加多少

解决中文版Chrome下网页不能显示小于12px字体

CSS在IE与Firefox下的兼容性

DIV边距属性在Chrome和IE中不兼容问题

IE6下图片下方有空间距的多种解决方法

任意图片实现垂直居中的三种方法(兼容性还不错)

精品推荐
分类导航