Sorry your browser is not supported!

You are using an outdated browser that does not support modern web technologies, in order to use this site please update to a new browser.

Browsers supported include Chrome, FireFox, Safari, Opera, Internet Explorer 10+ or Microsoft Edge.

Programming Talk / HTML - Need help in spotting why my page shifts slightly

Author
Message
Sid Sinister
20
Years of Service
User Offline
Joined: 10th Jul 2005
Location:
Posted: 26th Aug 2009 02:52
Okay, this has been driving me nuts, and now that I've almost finished this website for my client I need to figure out what's wrong.

View http://www.landgraff.com/newsite/process.html and then click on the work link. Do you see how the page shifts to the left 1 or two pixels??? Why the heck is it doing that? I have looked at everything and I can't see to find why this slight shifting occurs. Any guesses?

"If I have seen a little further it is by standing on the shoulders of Giants" - Isaac Newton
Current Project: http://strewnfield.wordpress.com/ (Last updated 06/11/09)
ShaunRW
DBPro Developer
18
Years of Service
User Offline
Joined: 7th Jan 2008
Location: Brisbane, Australia
Posted: 26th Aug 2009 08:13
I don't see the shift. What browser is this happening on? i used Internet Explorer 7.


Rudolpho
20
Years of Service
User Offline
Joined: 28th Dec 2005
Location: Sweden
Posted: 26th Aug 2009 09:12
I see no shifting either, using FireFox.

Sid Sinister
20
Years of Service
User Offline
Joined: 10th Jul 2005
Location:
Posted: 26th Aug 2009 09:33
I'm using Firefox 3.5.2. It doesn't do it in IE, just noticed that too.

I've made a video showing you what it does on my end: http://screencast.com/t/xFnZmAiV

See?

"If I have seen a little further it is by standing on the shoulders of Giants" - Isaac Newton
Current Project: http://strewnfield.wordpress.com/ (Last updated 06/11/09)
Phaelax
DBPro Master
23
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 26th Aug 2009 10:35
Weird, but it doesn't happen to me either, using IE6.

Just tried it in FF 3.0 and I see it. As I watched it load I think it may have something to do with the image content being loaded within your container. The margins seem very close together on the edges of the container, so its possible all those images are increasing the width very slightly by 1 pixel.

[url="http://www.nocleanfeed.com"][/url]
Diggsey
20
Years of Service
User Offline
Joined: 24th Apr 2006
Location: On this web page.
Posted: 26th Aug 2009 13:11
I can see the effect, and I'm not sure, but it looks as though the right side doesn't move as much as the left side.

Sid Sinister
20
Years of Service
User Offline
Joined: 10th Jul 2005
Location:
Posted: 26th Aug 2009 19:49 Edited at: 26th Aug 2009 19:51
Those images in the work section are actually inside of a php frame:




Could the child frame still affect the parent frame? I thought it would just overflow. Regardless, the images in the child frame are pixel perfect the size of the parent frame.

I've already completely redone this page in trying to fix it and it didn't work. So I'm guessing it's more of a layout error than it is a programming one. Odd how FF does this. Usually it's the red headed step child IE that acts up.

PS: I took two screenshots and overlapped them on each other in photoshop. The whole page moves to the left 1 pixel.

"If I have seen a little further it is by standing on the shoulders of Giants" - Isaac Newton
Current Project: http://strewnfield.wordpress.com/ (Last updated 06/11/09)
Diggsey
20
Years of Service
User Offline
Joined: 24th Apr 2006
Location: On this web page.
Posted: 26th Aug 2009 22:28
@Sid
In the second page, there is a 1 pixel wide image 'spacer.gif' on the right side, which is shifting the whole thing to the left.

Sid Sinister
20
Years of Service
User Offline
Joined: 10th Jul 2005
Location:
Posted: 27th Aug 2009 04:27
Diggsey! That was it! Good catch! I knew I should have posted this question here

BigAdd explained to me in an e-mail that part of the reason I'm having trouble with this sort of stuff is because I should use tables for tables and leave layout to css. I think that's great advice and how I will proceed in the future.

Thanks for all your time

"If I have seen a little further it is by standing on the shoulders of Giants" - Isaac Newton
Current Project: http://strewnfield.wordpress.com/ (Last updated 06/11/09)
Phaelax
DBPro Master
23
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 28th Aug 2009 04:38 Edited at: 28th Aug 2009 04:46
Tables is no reason to have trouble with this, if anything tables makes it easier to build layouts in my opinion. But the web-dev community generally only wants to see tables used for displaying data as they were initially intended.

The code looks like you used an editor that automatically built it. Did you write this from scratch?

[url="http://www.nocleanfeed.com"][/url]
Phaelax
DBPro Master
23
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 28th Aug 2009 06:21
I took the liberty of converting your site to CSS. I did trim the width of the processtitle.gif image because I didn't need it to be the width of the whole content area.

http://zimnox.com/landgraff/

[url="http://www.nocleanfeed.com"][/url]
BiggAdd
Retired Moderator
21
Years of Service
User Offline
Joined: 6th Aug 2004
Location: != null
Posted: 28th Aug 2009 11:55
Quote: "Tables is no reason to have trouble with this"


Tables aren't the direct cause, but due to the incredibly messy markup, it can make it harder to figure out anything that is going wrong.

As you can see from your Source, if there were any display issues, you would simply go straight to the CSS.

Login to post a reply

Server time is: 2026-06-10 03:30:32
Your offset time is: 2026-06-10 03:30:32