Background Color Flickers Before Loading Background Image

[missyjknox 0]

Hello, As my website loads, there is a flicker of black shown before the background image loads. This is the CSS used to place the image: body.page-id-1477 #page-canvas {background:url( ); background-position:center} Any suggestions on correcting this?

[catrina 103]

The background color set in Design Control is probably black. You can change that background color to the shade of orange you're using in the background so that the black disappears. If there is any black used in any code for the background, it might also help to change that color to orange, too.

[missyjknox 0]

All pages, besides the splash page are black. I used Design Control to accomplish this for all pages except the Home page. I'm sorry, I don't understand your resolution for I want said pages to be black.

[catrina 103]

I was thinking that the black flickers would be coming from somewhere, but I didn't know you wanted the background color to be black in your other pages. If you view your site in other browsers, does the background still flicker before loading the background image?

[missyjknox 0]

I notice it on my PC in IE.

[Kate 3]

What you could try is adding the important declaration, along with the orange color. Something like this:

body.page-id-1477 #page-canvas {background:orange url(http://acedoubleyou.com/wp-content/uploads/2011/07/concept4.png) no-repeat center center;}

Note the "orange"... please replace that with the shade you actually used (in hex format).

[missyjknox 0]

Hi Kate, This is the code I used and it's still happening: body.page-id-1477 #page-canvas { background-color:#ff6501; background:url( ); background-position:center} Did I miss something? Somehow PlatformPro is reading the color set in Design Control before it loads the background image for the home page. Should I upload the home page background image using HTML oppose to CSS?

[Kate 3]

Well, if you could try what I posted that would be better Here's a modified version:

body.page-id-1477 #page-canvas {background:#ff6501 url('http://acedoubleyou.com/wp-content/uploads/2011/07/concept4.png') center center !important;}

[missyjknox 0]

Thanks Kate, sorry for the delay in responding. Monday is the only day I can address theme vanity issues as this. Your fix worked in a sense that black no longer flickers before the background image loads, but the background color does, which is better.