Problem with full page background image

[feucht.co]

Hello everyone,

This is my first time posting here at css-tricks. I am grateful for all of your contributions.

I came across Chris’ solution for the full page static background image at https://css-tricks.com/perfect-full-page-background-image/ . Basically the CSS to achieve this affect according to Chris is :
html {
background: url(images/bg.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
Well, I have pasted this onto the style.css sheet for our site, but I am not getting the desired results. Instead of the image being static, I am getting a white background. I know that my image tag is correct because something strange is happening. If you have a slow enough connection, you will see it too. The correct image is there for a split second, then it disappears and leaves only white space in its place.
I have used firebug to disable all the other CSS to see if I could find the culprit, but I can not find the issue.
Do you have clue as to why this is happening?
Is there a debug method that you know of that could use to find the problem?

Thank you all in advace!
The site is http://www.brownsauction.com

• Clay

[georgearnall]

Hi there,

I checked your style sheet and I immediately see that your selector is not correct
html1 {}. Also, your reset is adding a white background to the body. You should set this to background: transparent;

Hope this fixes your problem :)

[feucht.co]

Brilliant! Thank you, George!

I started messing with the html selector last night trying to troubleshoot and I changed it to html1. The culprit was the white background in the reset.css. I didn’t think to look here as I thought the reset came before the other CSS rules, and I thought these rules would overwrite the reset. I appreciate your expertise.

On to the next one…

Have a good day.

-Clay

[Author]

Posts