Ok, so usually I'm pretty good with CSS. But this one... I can't quite wrap my ahead around why it's occurring. 

I did find a couple of 'quick fixes', but I don't want to just do something for the sake of doing something, so if anyone can help me understand this anomaly, please come forward (I've tried searching the web high and low, and can't find anything about this)!!

The issue occurs when using hash(#)/anchor links. I've put together a Fiddle to better explain what's happening.

First, go here: <http://jsfiddle.net/GKCE6/5/show>. Looks good, right?

Now lets add the hash(#) symbol to the URL: <http://jsfiddle.net/GKCE6/5/show/#some-content>. The header just disappears! Gone! Nada!!

Any ideas? I noticed that if I remove the `overflow:hidden` rule from the `div#container`, the header comes back. The project I'm working on, though, needs the `overflow:hidden` rule to eliminate horizontal scrolling. I could probably do something like `overflow-x:hidden`, but like I said in the beginning, I would rather try to understand why this is happening so I can determine the appropriate fix.

Anyone else run into this before?

*Fiddle: <http://jsfiddle.net/GKCE6/5>*