Sidebar shifting to bottom in IE6

I think the sidebar is too wide to fit on the right and so is floating down underneith the main content. Try putting a temporary 1px border around it and you will see.

IE6 has a different box model to other browsers so padding and widths are treated differently. Try reducing the width, padding or margin of either #content or #sidebar in style.css

Hi

The above advice is correct, but if you change the value in style.css that will also change it in all the other browsers, where it is already working correctly. .

Here is a line of CSS code that uses an IE6 hack. If you add this as the last line in your style.css it will probably fix your IE6 problem

* html #sidebar { width: 225px }

thank you stvwlf!

my template has a ie.css which I am assuming is only for IE browsers (?). That’s where I added the line of code and it seems to be all good now.

You are correct about ie.css being for IE browsers. Using Microsoft conditional comments it is only loaded when the browser being used is an IE browser

stvwlf

I have the same kind of problem with my blog on https://www.the-redplanet.com/blog
when u open it in ie the sidebar comes out on top.

Any advise?

@stvwlf

Your advice worked for me. Thank you very much!
However my IE6 fix was to make the whole page 5px wider, not the sidebar:

#content { width: 995px; }
* html #content { width: 1000px; }

I am also facing a similar problem on my blog. But surprisingly, the problem is only with the home page (index.php) on which the sidebar is shifted to the bottom when viewed in ie6. All other pages display well. Would appreciate suggestions to fix this problem. Thanks in advance.

I just noticed that some of the single post pages also have this problem.

Thanks everybody. Finally I fixed it by changing span-16 { width: 620px;} in the css to span-16 { width: 615px;}