View Full Version : Help with weird flickering in header/nav/background images?

Jason Thompson
10-29-2008, 01:14 AM
Hi guys -

I'm trying to clean up a project my boss started - I'm not typically a web designer but I tend to get the random IT projects... I can do okay in HTML and CSS but I'm not a guru and have been having some issues tracking down a problem with this project. On top of it all, this site has a table for the navigation/header, and I'm certainly not a tables guy, so any tips would certainly be appreciated!

My big question is:
I'm getting a weird flicker across my header/nav area/background images, when moving from page to page (as if the header/nav rollovers/background images are being reloaded) - which is odd, since all the pages should have the same navigational and background items. Is there some way to make these images load once, and then stay constant across all pages on the site? I'm getting it in Firefox as well as IE 6, same results.

The biggest issue I need to solve is when it reloads images that are already there and momentarily changes the size of the navigation table when changing from page to page, which also causes the whole page layout to shift slightly and then revert to the desired location (on page change.)

It's currently here for preview:
Replicate my problem by rapidly clicking between pages using the navigational buttons.

Ideally I could get it 100% validated before asking you guys, but I'm also having issues there - I am receiving errors across the site such as:

# Error Line 89, Column 59: document type does not allow element "br" here; assuming missing "li" start-tag.

<li>You want something unique and personalized</li><br/>

# Error Line 91, Column 7: document type does not allow element "li" here; missing one of "ul", "ol", "menu", "dir" start-tag.

<li>You want something that looks natural and has character</li><br/>

I am puzzled by this - I don't understand why I can't use <br/> there - is this using some weird Doc type that is causing this? Because as I understand it, to do a unordered list the code goes:

<li>listed item</li>
<li>listed item</li>
Am I doing that wrong somehow? Because I definitely have a <ul> and a </ul> in there, and the <br/> that are failing validation are definitely affecting the list's layout in the browser.

Thanks in advance for any assistance!

10-29-2008, 01:54 AM
Why do you need a line break? Just adjust padding/margin/line-height for the LIs.

10-29-2008, 08:23 PM
You can't put the <br /> where you have it because you are in the <ul>/<li> block and it's not allowed in the middle. You might move it to inside the closing (/li> block and try that or just use margins/padding as was suggested.