I've started on a web site that consists of a few pages that are relatively the same. The page headers consist of a background image with another image over the top of it. When I navigate from page to page, it has an annoying flicker. It seems like the background image of the header is the part that is flickering. Is there a good way to prevent it.

Here is the css for the header:

/* Header */
#header { background-image:url('../images/logoblank.gif'); border-bottom: 2px solid #000; }
#header h1 { color: #004b6f; margin: 0 0 3px; padding: 24px 18px 0; }
#header p { color: #666; font-size: 11px; font-weight: bold; padding: 0 18px; }


See http://www.nightwi.com/index.html

I'm not getting flicker in IE and header displays on all pages. In FF, the header display on the index page only and doesn't show one the other pages. You have errors in the markup. Validating your code may resolve the issues.

Strange, I tried it again and still get almost the whole right half of the header flickering each time I change pages. Also, the header shows up on each page for me.

Probably your monitor setting. Looks great on my puter

IE, Chrome, and Safari displays fine.

FF causes the entire header area to display on a couple of pages and not on others. It briefly display with broken image and then the entire header is gone.

Opera display the header in some pages but not the left logo image on others. The right background image is seen.

Fix the errors identified by validating your markup html and css, first.

http://validator.w3.org/

http://jigsaw.w3.org/css-validator/

Try removing the .. from the ../ in your css file.

You're not using IE6 are you?