Ye old familiar SideBar Drop in IE6

[Kathy]

http://raginggrannies.net/

The sidebar drops, but only in IE6 on XP, on the index page, not the post pages or blog pages. It drops when I view it from my IE6 pc at work with XP, but not with my older pc at home that has win2k and IE6.

It was fine till a member of the committee (YES! it was a Design by Committee project!!!!) said she wanted the sidebars to look different. So I messed around with a border and the padding and background color, and now cannot get it back to where it was before.

I asked for help on a list I belong to and they complained about multiple stylesheets. I used this theme as a basis for the project and modified it, heavily. http://www.dezzain.com/testrun/

Some of my audience and users have older pc's and don't know about Firefox, I'm trying to educate them, but still it would be great to get rid of the drop.

[joetek]

I don't have IE6 on a computer handy, but if you were changing the padding, you may have made it too wide to fit, so it may have dropped down and display below your content. Older browsers interpreted css differently, so it may affect IE6 and none of the newer browsers.

If this is the case, try reducing the width of the sidebar by 20px, and see if that fixes it. If so, then slowly bring it closer until you get it as wide as you can without it dropping again, and set it there. Of course, check it again in IE7 and FF once you're done.

Also, make sure this is a global problem. In other words, make sure the sidebar has dropped not only on the homepage, but on posts, categories, archives, etc. If it's only happening on the homepage, for example, then it could also be caused by an image or video embed in one of your posts that is too wide, or a div or script within a post that wasn't closed properly.

It always amazes me to look at the stats and see how many people are still using IE6. It's not insignificant. When IE8 hits release in a few months, I hope more people will upgrade, but there will always be people out there with old browsers.

[tekzt]

When IE8 hits release in a few months, I hope more people will upgrade, but there will always be people out there with old browsers.

I actually had a visitor with IE 3 on my website.. boy, i laughed when i saw that in statpress... wonder what my site looks like in there :D

[JLeuze]

Kathy, if you are not already using it, I strongly recommend giving the Firefox plugin Firebug a try. It is extremely helpful for figuring out why things don't fit together right.

I noticed that even in Firefox, there are a gap on the left of a few hundred pixels, both columns are being pushed to the right and this is what is causing your sidebar to drop.

I took a look at your CSS in Firebug, you have this rule for your wrapper:

#wrapper
background-position:center top;
background-repeat:repeat-x;
margin:0 auto;
width:970px;
}

I noticed that your header graphic is 1198px wide, but the wrapper is 970px wide, so that wrapper is pinching the content a bit.

When I disabled the "width:970px;" declaration, it fixed the problem and removed all that white space to the left.

This still leaves the content area much narrower than your header, you could edit this rule to widen the content div:

#content {
float:left;
margin:0;
padding:25px 0 0;
position:relative;
width:970px;
}

Of course, then you might want to widen that first column to fill up the extra space and add a bit of margin to the left side.

[Kathy]

I'll try those fixes. Thank you. I admit to being weak in my CSS skills. I do use Firebug and the Web Developer FF extensions. But I can't see the drop at home, and that makes it harder for me to work on this.
I tried a few tweaks on the stylesheet while on my lunch hour, but they didn't work, and I didn't have my FF extensions helping me.

[JLeuze]

No problem Kathy. I love being able to highlight divs and other elements with Firebug and actually be able to see them in my browser, it takes care of so many headaches.

Yeah it's no fun trying to fix a problem you can't see. The sidebar does drop on my end in IE6 running on Windows XP.

[Kathy]

I think it's fixed. Can you check for me please? IE6, XP

[Paul]

It's fixed here Kathy -- IE6 (getting a rare outing) on XP.

[JLeuze]

The sidebar is no longer dropping in IE6, but you still have some alignment issues.

The header is left aligned, but the navigation and content are centered. This could cause issues on wider screens:

[Kathy]

I changed the header to margin: 0px auto;, went to browsershots and selected 1680 pixels wide, and it appears to be aligned now.
Thanks !:)
Wish I had the time and knowledge to just create my own theme from scratch. At least I'd have a better handle on the code.