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.
1. Go to your wp-content/themes/<i3theme> folder and open the style.css file in your favourite text editor.
2. Search for “#sidebar” (without the quotes) until you reach the following code:
#sidebar-right,
#sidebar-left {
width: 210px;
color: #666666;
line-height: 160%;
}
3. Now, modify this code to look like:
#sidebar-right,
#sidebar-left {
width: 210px;
color: #666666;
line-height: 160%;
word-wrap: break-word;
}
4. 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.
[tags]i3theme, i3theme 1.6, WordPress, sidebar, IE, IE6, Internet Explorer, word wrap, i3theme sidebar issue, i3theme sidebar problem[/tags]
I still have same problem with my blog at sefanboy.com, even after follow this instruction
can you help me?
alex, your problem seems to be caused by some issue with the main content area and not the sidebar. Did you try adding this property to the main content area in the CSS?
I don’t really understand what do you mean. I ‘m not expert in wordpress
I add the code on style.css of course. but maybe i put too large image or video?
I add this code in style.css in my theme, not main content area.
any idea what should i do with main content area?
alex, by main content, I meant #content in style.css. Anyways, I tried adding the property in ur style.css (saved ur page and tried there on my local machine) but it didn’t work. Most probably its not text but some pic/vid etc thats causing the issue.
I had the same problem and it’s fixed. If you go to download version 1.6 of the i3Theme form mangoOrange.com, you’ll see that the problem is solved for IE.
Hope this helps.
I don’t know, I have upgraded to 1.6 version, but still show error. I think i have to change with 2 column or switch to other theme
I tried to validate css of the theme, and found some errors there.
check here:
http://jigsaw.w3.org/css-validator/
Hi Shantanu,
I used i3 theme 6, right sidebar.
I have problem for IE 6, that the midle sidebar go down and not place properly.
Could you help me to fix it?
Tnk be 4
Http://optikonline.info
Kastam: Have you tried the fixes listed in this post and the previous one on the same issue?
i was having the same prob with the i3 theme and the leopard theme both the trick posted on this blog didn’t worked, i saw this line “margin-left: 10px;” in my css below “line-height: 160%;” and i removed this line and it fixed the error in i.e 6
I don’t know what are the side effects of removing this line but i am glad that i fixed it
so can anyone tell me will removing this line affect anything?
Saad:, basically what that line did was to create a margin of 10 pixels on the left side. Since u removed that, the margin was removed, and whatever the interfering part was got shifted to left by 10 pixels, and hence ur sidebar came up.
oh thanks for the info mate
as you must have noticed that i don’t know anything about php
hey what are you doing to add “If you liked this post, then you can Subscribe to my feed” in every post?
Saad: I had tried to reply to u when u sent in the msg thru contact form but ur mail address bounced somehow.
Anyways, I’m using my WordPress plugin “Shantz-wp-prefix-suffix”, which allows you to add any text or html/css code to the top and/or bottom of your all your posts and/or pages.
You can download it from here: http://tech.shantanugoel.com/projects/wordpress/shantz-wordpress-prefix-suffix
strange :S it shouldn’t bounce
anyways thanks for you help!!!
You save me. thanks!
Instructions for i3theme 1.6, 1.7 (Tested both on WP2.5 and WP2.6)
1. Go to Admin panel
2. Click on Design
3. Click on Theme Editor
4. Click on Stylesheet (style.php) on the right hand side
5. Find ” /* sidebar */ ” (without quotes, should be through the end
6. Remove “margin-left: 10px;” from #sidebar_right. (For techies: this code is useless because it is already floated right)
7. Go and have a cup of tea
Made a mistake on section 4. The correct file is style.css, not style.php
How to make i3theme WordPress 2.6 compatible (image floating, gray box)?
Add the following code at the end of style.css (directions provided above)
/* WP 2.7 */
/* Captions */
.aligncenter,
div.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}
.wp-caption {
border: 1px solid #ddd;
text-align: center;
background-color: #f3f3f3;
padding-top: 4px;
padding-bottom: 4px;
margin: 0 10px 0 0;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
.wp-caption img {
margin: 0;
padding: 0;
border: 0 none;
}
.wp-caption p.wp-caption-text {
display: none;
}
/* End captions */
I added a text widget to the left column and it caused both the middle and right columns to drop down. I have tried removing the “margin-left: 10px;” from #sidebar_right. and sidebar_left,
I also decreased the size of the image that I was placing in the column. I”m not using IE, I’m using Firefox 3 – Please Help – I love the theme
I have the same problem
Wordpress 2.61 with i3Theme Center edition versions 1.6 and 1.7.
SO the right sidebar drop down and now is located under at bottom of main column. I tryed everything described in comments, but no result.
PS
All plugins are deactivated.
PLEASE HELP.
Check if there is some sort of image etc that is bigger than the width of i3theme’s sidebar?
Hi , great blog, really helpful, i’m building a few WP sites so there are always a few questions keep up the great posts. I’ll be posting more articles on my Web Design Blog http://www.scottydonald.com
thanks very much man
i really needed it
real amazing trick…