Solve the Problem of invalid background of DIV in Firefox

There are two horizontal columns (DIV) in a large Div, and the background image is added to the large Div. However, after modification, the background image cannot be correctly displayed in Firefox.CodeYes:

1. html (sample ):

<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;
}

This is because your # footer_left and # footer_right add float: left. In ff, if float: left (right) is added to the element, it will not be supported, that is to say, its height is 0. If it is displayed normally, the following must be added: overflow: auto, I .e.: # footer {
Width: 730px;
Background-image: URL (../images/bg.jpg );
Background-repeat: Repeat-y;
Overflow: auto;
}