Posted by Sadish on October 13th 2006
Sidebar drops down !
Lets take a look at one of the most common problems with the wordpress sites.
The sidebar does not stay on the side, and it falls down to be below the content area.
and the thing is, it is not consistently doing so. Sometimes it is just happening in IE and sometimes it happens only on certain posts or only on homepage.
Here are the list of things you can do to fix that.
Step 1. Validate !
This is the most common cause for this issue. Try to validate the page that has this issue, at W3C’s Validator.
Once you fix the issues found by the validator, Refresh the page and see if the problem is gone.
If not, go to step 2.
Step 2. Check your Images Width
The next cause could be, your images are wider than the ‘main content’ div (usually #content in most of the themes).
If it is OK, try to resize the image to fit within the content DIV.
May be, you can give a smaller size image on the page, and the full-size image can be hyperlinked to that small image. This also helps in faster loading of your page.
If the problem persists, go to Step 3.
Step 3. Reduce the size of the ‘Content Area’
You can open up your style.css and look for the ‘width’ definitions for #content and/or #sidebar.
Try to reduce the width by 5px or 10px or 15px or 20px or 25px till you get things right.
(Most Layouts will still look good, after reducing the width by this method.)
Most cases would be solved by now. (If you guys have any other suggestions, please let me know).
Thats all for now, folks !
This is a website by Sadish Bala, created to share the news, tips and tricks on using WordPress.
Sadish,
I’ve tried a couple of different fixes, including (http://wprocks.com/wordpress-tips/floating-images-within-the-post-in-wordpress-26/) and I still can’t get my sidebar back where it belongs. It drops right to the bottom. I’m using Paalam.
I’ve fiddled around with the width in here:
/* Content */
#content {
float: right;
width: 640px;
padding:10px;
}
/* Column Two */
#sidebar {
float: left;
width: 205px;
padding: 10px;
font-size:0.9em;
margin:5px;
}
Any suggestions?
[...] Sidebar drops down ! [...]
The problem for me was that I had copy/pasted some html over from blogger.com and it seemed to have over-ridden something in the template. After doing steps 1,2 and 3 above, I then went on to unpublish each post one by one until the culprit was found. Then I removed all formatting and all pictures from the guilty post and rebuilt it. Now everything is fine.
Step 1 Worked for me. Moved the word-copied text to the notepad and then repasted it on wordpress. sidebar stayed as it should.
thanks.
I’ve noticed that my wife’s site that uses Misty Look (3.7.2) has the dropping sidebar problem, but only when I wasn’t logged in. W3 Validator complained that there was a missing closed element. That led me to believe that there was a conditional bug in the PHP. Sure enough, the tag terminates inside an if/else/endif conditional.
To fix this, move the from comments.php line 86 to between the two endif’s at the end of the file.
If there is a standard way to submit a patch to Sadish, please let me know.
Hi,
I have this strange problem with the sidebar, One I have checked the “Users must be logged in order to comment” the comment form just disappear (as usual) but then, my side bar felt down under the content. I go and uncheck the option and, the sidebar goes fine again. It seems that for some reason, page.php layout change for some reason, at least this is what firebug says to me. Any suggestions?
Mauricio
Hi,
I am having this problem too.
How can I fix it if I can’t pay for the CSS thing on wordpress? I am not able to edit my CSS unless I have paid money, I believe, so I don’t know what to do. =(
Lea
Thanks! I had this problem with ie6. Now it works with 3d step.
Nice Topic here! Thanks!
I would like to add a situation:
I use the plugin “thumbnail For Excerpts” I found out that with certain image files like gif and png the sidebar also slides down!
I hope someone will find this use full.
Cheers
Heyman
W3 shows 3 errors..
How can I exactly Fix there?
Where do I need to change the code?