This is by far the most bizarre thing I've come across in my experience of web development. When I click a link to page.php, it takes me to page.php and the layout is fine (surprisingly not the bizarre bit). However, if I then refresh that very same page, the layout changes, making a relative positioning blank (with background image) space appear in a big chunk at the bottom of the page. Hitting a link to page.php (say a href to the same page as an alternate refresh) gets rid of it, but refreshing just brings it back.
Changing the few remaining relatives to absolute makes no difference to the blank space - to the extent where I can remove ALL relative positioning and it's still there. Also do not have any noticeably large minus positioning, like "top:-100px", and such. Yet, it disappears if I simply reclick the link to page.php instead of refreshing.
Self taught so god knows what horrifying habits I've picked up, relative positioning being one I am currently phasing out.

The code is very long because it's a very complicated page, half the css taking up 8500 characters on its own (well, I don't have anything to compare to but it certainly seems like a lot to post), so I can't really post it, and I'm using localhost so can't link it either. If it's necessary and some insane person would actually want to read through it, then I'll see about posting it. But generally was just weakly hoping that someone could offer advice simply from the description.

Recommended Answers

All 6 Replies

what browser are you using?
Have you tried other browsers?

Guessing it is some sort of cache issue.

might also try some fixed and/or static positioning to see what happens.

Happens on Google Chrome.
Mozilla is fine, and as a huge surprise, IE doesn't do it either.

Tried emptying the cache and it doesn't fix it.
Also have played around with all the positioning, absolute included.
(didn't realise it was only not working on chrome - that's slightly better)

If you are using PHP then maybe through the code you can detect what browser is currently being used and then make changes in the CSS positioning accordingly. For instance, you can detect if Google Chrome is being used and then reposition that particular offending element. Sometimes really bizarre things begin to happen when you are creating layouts in CSS :-). Of course this is not a proper solution. May be something happens with the sessions of the browser.

That's the thing, I don't know what I would change to get rid of the white space, since it seems to be generated by the refresh, not particularly through relative positioning.

The problem has gone away today, strangely, must have been a browser problem that needed a restart..
Thanks anyway guys :)

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.