I have <http://www.mrfishermusic.com/>

You'll notice that the main wrapper is 1042px (#main). Then I have #container surrounding that which is width 100%. I made it like this because the background image of the page is huge width wise.

The problem is if the browser is resized small horizontally... say like.. 700px wide (or way smaller, like on an iPhone), when you scroll to the right the header and footer both just disappear, although the #main wrapper remains intact.

I see some other people had this issue but I'm not a CSS ninja so I couldn't quite reproduce the solution onto my site - I apologize if this has been asked before.

Thanks!