Content displays below sidebar.

Since I added a sidebar to the right of this website, http://allpointer.com/shopping, the content has shifted to the bottom of the page. This only happens in IE, but displays just fine in firefox. I tried making some column width adjustments without any success. Please help in resolving this. Thanks.

 

Are you sure you have defined the content within the sidebar <div> tags?

Q...

 

Here is what I have for the sidebar definition (<div id="right_side">) in an external css file:
#right_side {
margin-top: 10px;
float: right;
width: 160px;
background: #F1F6FE url('../img/side_bg.gif') bottom left repeat-x;
}

 

Okay-- that looks right-- key img is a background. If the content is slidng down and you are not testing in an Opera browser this normally means the content is too wide for the area defined by the sidebar. You may also want to ensure that the background image is not too wide for the sidebar area. This could also cause problems.

If you are testing with Opera-- make the window larger to see the true layout.

Q...

 

Thanks. I've tested this site on IE (5, 6, 7 & 8), FireFox and Opera. It displays just fine in Firefox and Opera with a wide window. However, all the Internet Explorer versions drop the content below the sidebar, even in a wide window. Also used browsershots.org to test display on various browsers, and IE still acted same way. IE is the main browser used by most of the site visitors.