...

View Full Version : sidebar ends up in middle of page in IE, when horizontal scroll comes in to play



MECU
07-21-2008, 08:00 PM
http://www.bcsfanpoll.com/userpoll.php?week=0&year=2007&username=MECU&submit=1

In Firefox, the left sidebar still renders on the left of the page, like it should and does for every other page (even in IE).

But in lovely IE 6 (haven't tried others), the left sidebar ends up in the middle of the page. My thought is since I'm using a -100% margin-left and since the content overflows the page and causes horizontal scrolling, IE subtracts the page width from the ends that has been extended which is why it ends up in the middle of the page.

How can I get IE to force it back to the left? In essence, ignore the scrolling?

MECU
07-22-2008, 12:31 AM
Works okay in IE7.

MECU
07-22-2008, 04:19 PM
I tested 18 browsers in 3 OSs and only IE5.5 and IE6 were broken. Both on Windows.

FYI, I used http://browsershots.org/

MECU
09-24-2008, 10:14 PM
It appears to not be browser related, since in Firefox, when I shrink the browser window small enough (roughly lower than 900px wide) the left sidebar starts moving towards the center of the page. This is only a minor concern, since most users are using resolutions larger than this, but it more often than not occurs with software taking browser thumbnails of the site:

http://www.text-link-ads.com/alexa_image.php?packageID=90048

That orange/peach block in the middle should actually be off to the left, where the white space is. The more you shrink the window horizontally, the further to the right the bar moves, even moving off to the left of the page.

Everything works fine when the window is large enough.

Anyone have any ideas?

Kitsune
09-25-2008, 01:55 AM
A few things to try, either one by one or both at once:

1 - Try moving the HTML of the sidebar up above the stats table. I know sometimes things read left to right, so with the sidebar being below the table, it may be trying to move to the right of the table.

2 - I don't see a float tag for the sidebar, try floating the entire sidebar to the left.

abduraooft
09-25-2008, 10:20 AM
Check http://bonrouge.com/2c-hf-fluid.php to see how to apply floats and margins to make a good 2-column layout.

MECU
09-25-2008, 01:38 PM
I did have the sidebar floating. I think the problem was the negative margin I was using to play it on the left. So I changed it to absolute position, since I always want it on the left and can easily calculate that position (zero!), it makes sense. Seems to work and it doesn't move around.


div#wrapper{float:left;width:100%;min-width:900px}
div#sidebar{float:left;width:200px;margin-left:-100#;background-color:#FFDFBF}
div#extra{float:left;width:150px;margin-left:-152px;background-color:#FFDFBF}


div#wrapper{float:left;width:100%;min-width:900px}
div#sidebar{float:left;width:200px;position:absolute;margin-left:0;background-color:#FFDFBF}
div#extra{float:left;width:150px;margin-left:-152px;background-color:#FFDFBF}

Thanks to both of you for trying to help.

Kitsune
09-26-2008, 05:13 AM
Glad you got yours working! Now if only I can get mine to work! :p



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum