I've noticed that links in becontrary.com that have have a fragment (i.e. something after a #) don't always go to the exact location of the named anchor. I figured this was a Firefox bug originally, but I see the same thing in other browsers. I believe I have figured it out though. The browser changes the scroll position after the html is read, but before the stylesheets have been read. Once the browser has the CSS information the page updates, but because the CSS contains the dimensions of some elements, the named anchor changes position -- but the scroll position doesn't update accordingly. At least thats my working theory. The only solution I can think of for this is to make all my style sheets inline -- but that would mean I wouldn't have the cache-related benefits of having them external. I can't be the first developer to be irritated by this. Can anyone offer a solution?
did you put a HTTP cache information on your CSS?
You can at least put 1 week or if not 1 month. Your CSS must certainly not evolve that much.
The browser will cache the information and your CSS should not take time to download at the second reload.
If you put your anchors in absolute positioning (I haven't looked at the details of your CSS), you might create issues indeed.