Alright, I have a DIV wrap around the entire design, which has a background-image: blah attribute. Now when you look at this in Firefox 3, it doesn't show that, but a white blank area.

http://www.cheapcss.com/blog/

If you look at it in IE 7, you will see it how it is meant to be seen.


edit:

adding these to the DIV wrap don't work:

height: auto;
height: inherit;

Although, if I use a definite value; such as "height: 1200px" it does work.
but since this is for a wordpress theme, it won't work right.

Put the link to the background image in an inline style for that div.

such as: <div id="wrap" style="background-image: url('images/yourimage.jpg')">

For whatever reason, putting it in the CSS file doesn't seem to cut it. Must be some weird bug; hopefully it will be corrected in updates. Telling the image to repeat in the CSS file, curiously, is not a problem.

Edit: Has anyone else experienced this? Usually, the cause is an improper path, such as if the CSS file is in a folder, and ../ isn't put in the path name when the URL is called for, or the quotes or semicolon are left out. But this happened to me as well, and calling for the background image locally was the fix. Very unusual for FF; generally you code for FF and fix for IE.

tim

Just another case of IE getting it wrong.

clear the floats after #footer

Agreed. Easy fix - add overflow: auto to #wrap - all floats inside will be cleared and the #wrap will actually, finally, contain what's inside it.

Awesome, I can always rely on you guys when I'm stuck!

edit: uh oh, I tried both adding clear: both to #footer, and adding overflow: auto to #wrap, but it's still producing the same problem.

serandfae's method didn't work either... Although it was strange, it works when I push my hotkey in dreamweaver for Firefox, but when I upload it to my server, it shows the white area.

edit2: alright, I figured out why it was doing that, I uploaded it to the wrong server directory XD

but only serandfae's method worked, I was uploading correctly when trying both of your methods.

I tried both adding clear: both to #footer

You don't add clear:both TO the footer, you add a block element AFTER #footer with a clear:both rule. Use an empty <div> or a styled <br>

The overflow:auto worked when I tested it with Firebug ;)

Lol, alright, I'm just a newbie; I probably messed something up :P