Some time back I had posted a little hack to fix an issue that users of i3theme have, i.e., their right sidebar drops to below the main content area in IE6. But it wasn’t that good as it took care of only the situation when this phenomena was caused by the tag cloud widget. So, here is a little modification I did to fix the issue more properly.
Go to your wp-content/themes/ folder and open the style.css file in your favourite text editor.
Search for “#sidebar” (without the quotes) until you reach the following code:
#sidebar-right,
#sidebar-left {
width: 210px;
color: #666666;
line-height: 160%;
}
- Now, modify this code to look like:
#sidebar-right,
#sidebar-left {
width: 210px;
color: #666666;
line-height: 160%;
word-wrap: break-word;
}
- That’s it. Save your file and you are done.
So what does it do? Basically I just added an attribute “word-wrap: break-word” to the sidebar handling. So, if there is a word that cannot fit in the sidebar width, the word will be broken to continue in the next line and thus the sidebar alignment will remain intact. let me know if you face any issues with this.
Note that this particular word-wrap property is Internet Explorer specific. Firefox (and other browsers) will ignore it, but since the problem with sidebar alignment occurs only with IE, so it will enable IE to display your site properly.