If you’ve already upgraded to WordPress 2.6, you might have noticed that WordPress handles images a little differently than the WordPress 2.5 branch and below. The main change is that you can now use the alt field to add a caption, which will wrap a sort of caption below the image.
The problem I’ve had with this new setup is that it can cause some problems when trying to float your images due to the new class=”alignleft”, class=”alignright” or class=”aligncentered” elements. The image will still move, but I’ve found the text won’t wrap properly around the image.
Thanks to a recent post from Sadish over at WP Lover, it looks like this problem can easily be fixed by by adding some code anywhere into your CSS stylesheet:
img.alignleft, div.alignleft {
float:left;
margin:0 0.5em 0.5em 0;
}
img.alignright, div.alignright {
float:right;
margin:0 0 0.5em 0.5em;
}
img.aligncenter, div.aligncenter {
text-align:center;
margin:0 auto;
}
This way the images should float and the text should wrap properly. Thanks for posting the easy fix Sadish!
Kyle Eslick
Kyle Eslick is WordPress enthusiast who took his passion for WordPress to the next level back in 2007 by launching WPHacks.com as a place to share hacks and review WordPress-related products.
These are all reasons why I have my blog on Wordpress. I really like how versatile it is and ...
Hi Kyle,
I had the exact problem you stated, my author archive went to
/author/Jordan%20Godbey
and my nicename in the database was "Jordan ...
Liked the "SimpleWP Theme". Neat and clean. Over all good collection of themes. 
The new download link for the wordpress help sheet:
http://wpcandy.s3.amazonaws.com/resources/WordPress-Help-Sheet.pdf 
really nice theme.thanks a lot 
Open php.ini file and increase the size. 
This is the post what i was looking for. thanx a lot… ? had a problem like this and solved via this great tutorial…
This has been killing me since I upgraded. I’m using a custom theme and it has been broken since I upgraded. This helps fix it a little, but it’s still broken. Thanks, I’m sure a lot of people could use this help.
Great tip, solved my new dilemna
Thank you!
Maria Reyes-McDavis
Exactly what I was looking for!
This is the kind of thing that makes me wish I stuck with the long term support versions of WordPress, changing things like this are pretty major and the fact that (at least to me) it doesn’t seem to be any real reason for it is ridiculous.
Thanks for the tip though, I will be adding this code and hopefully it will work just as well for me as it has for everyone else.
no. this doesn’t really work, either. the app is broken. it’s like there’s this giant tremendous elephant in the room that no one is mentioning. Something as simple as plain old 1999 image placement…. could we get some HTML tables to hold pictures?
Thank you.
I’ll try it.
Hi! I’m using a wordpress “letterhead” template, and no matter what I paste in my style.css file, i can’t seem to get my text to wrap around my image. I’ve got version 2.5.1, and it automatically asks me if I want to align my image left or right, etc., but it never takes, not even after inserting the code above.
What am I doing wrong? I did manage to get a wraparound text by moving the class=”alignleft part of my image code to just after the <img (instead of after the width and height indicators), but that syntax change, while it resulted in wrapping the text, made the image disappear, and also bleed into the top of my next post.
This is an example of what an image code looks like in my version of wordpress:
<img src=”http://newyorkette.com/wp-content/uploads/2008/07/hamburger_450.jpg” alt=”" title=”hamburger_450″ width=”450″ height=”401″ class=”alignleft size-full wp-image-675″ />
It should wrap around, but it doesn’t.
Can anyone help? This is what the image coding looks like in my letterhead stylesheet:
a img { border: none; }
That’s all there is! (until I pasted the code suggested here in, which didn’t change things for me).
Would love some help! Been dying to have wraparound text for years!
Wow, this couldn’t come at a better time! Thanks for the tip, I’ll be using it in about five minutes
Pretty, thanks!
Okay, I got some wrap around finally, but now I have a problem with the last photo, or the bottom of tall photos overlaying the footer of my post (the part that says, “leave a comment”, and even overlaying part of the header of previous post below it.
Does anyone have a code fix for that? I think it’s something to do with div clear, but not sure how that works.
Thank you soooo much.
nice tips ,thanks you~
Well, nobody had an answer for me, so I’m assuming nobody knew, so I’ll tell you what I found out for preventing the wrap around text from making the photos and text overlay the previous post header, etc. I got a clearer code: <br style=”clear: both;” />You just put that at the end of your post, and you won’t have any problems with the text and/or photo wandering into places it oughtn’t.
THANK YOU for this wonderful tip. I just switched to WordPress and this solved my issue. Worked well with the CopyBlogger Theme.
This is exactly why we should always wait for X.X.1 releases before updating WordPress in crucial websites.
Quick and easy fix for this problem
Good work!
S
Carolita (#14), I was having the exact same problem and your solution fixed it. I really, really appreciate it since it was driving me nuts. Thank you!!!!
Heather (#18), I’m glad to help! I posted that question in so many places, and nobody had any time to answer me. (I was beginning to wonder if this was a real forum!) Glad to know I actually reached someone, and was helpful too!
Happy blogging!
Thanks for this tipp. This is what I’ve searched for.
Hey… I’ve been noticing that when I upload images below a width of 232px that the images have been autoformatting to that width. Most of the images in blog posts on my site have done this, if you would be willing to take a look (click my name link).
Any tips or a stylesheet code fix you can provide me would be a great help. Thanks a lot man.
What I need.
Thank you
thanks a lot for sharing. Good luck for you
it fixed the issue on my blog, but it didn’t fix the issue in my RSS feeds. email is still showing images to the left, but they are fine and on the right on my site. do you know why this is? can u email pls
if u know
Wicked! Thanks a bunch
Thanks so much!
Thanks! Solved my problem in an instant!
This is exactly what i m looking for
thanks a lot!
My goodness, thank you for this post.
Thank you, thank you thank you
Works in Firefox great but doesn’t work in IE.
My apologies.. works fine in IE and Firefox. My page was cached. Thx!
Posting just to say thanks for this easy fix!
Thanks so much Kyle. I agonized over this for hours until I came across your post. You are my new god.
What css file are we supposed to edit? I’ve got 50 it seems!
Lea,
You should only have one css stylesheet. Are you in the actual editor? It’s typically the last one in the list (though not always).
Thanks Kyle…(two years later) your post is still helping people like me! Text “was” wrapping fine in my newer WordPress versions until I happen to change to a new theme yesterday, then it quit wrapping. That bit of code in your post fixed it!!!
Thanks a million!
Perfect solution. thanks
Great tips. I was directed to here from one of the topic on wordpress support.
Seems like the code you’ve given fixed my problem with wrapping post around the image.
However, can you perhaps share how to make the caption of the image shows as well? I can see it clearly in the editor the image and its caption showed just nice but when the post is published, the border around the image and caption were gone.