I've now managed to get a fixed header image, thanks to Pertex, but does anyone know how I would achieve the following?

I know it's not clear from the image, but the game text is actually flowing OVER the header, not behind (I've confirmed this by changing the font colour to black so that I can see it)

I've tried various margin-top / padding-top to different elements; body, div#gamePanel, but all this does is add a white margin which scrolls away anyway.

You might be able to use a jQuery line to set the z-order of the image. (Depending on how the image gets into the stream, it might just be a CSS change, per your other question.)

When you say the z-order, I presume you're referring to the order in which layers are stacked?

Either way I'm lost on how to do either of these.

[EDIT] Good heavens! Given your post, I typed 'j-query z-order' into google without even the remotest hope I'd find anything that even made sense, let alone provided the answer. However, I found something on the Stack Overflow site which suggested 'z-index: 99999;' as a solution to someone's stacking problem, and low and behold when I added it to the div#gamePanel class in my CSS it worked!!

Thanks, J

Glad to be of help.