So I have finally updated my blog to WordPress 2.6 and I wanted to try its new features. Just before this new release, I was looking for a plugin that can caption images. It’s a pretty neat feature of wordpress 2.6. So I went ahead and tried. What happened was that there was no style. It didn’t look good. I went ahead and took a look at my page’s source and tried to edit CSS but it didn’t work.
But yesterday, I found this codex article at wordpress dot org. It has fixed the problem. Here is the code block that you need to in order for it to work with style;
.wp-caption {
border: 1px solid #ddd;
text-align: center;
background-color: #f3f3f3;
padding-top: 4px;
margin: 10px;
/* optional rounded corners for browsers that support it */
-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 {
font-size: 11px;
line-height: 17px;
padding: 0 4px 5px;
margin: 0;
}
Of course you can edit this as you want to fit to your custom wordpress theme. I have changed couple of things and here is how it looks;
This is a picture I took in St. Petersburg in Russia.
Excellent post. good luck.
thanks! just what i was looking for!
copy – paste and it works!
Thank you – this is exactly what I was looking for…
Thanks for this fix mate, really drove me nuts not getting it to work! Much appreciated!
thanks so much for this! exactly what i was looking for.
Thanks!
This was helpful
.
YO might want to add text-align:center to the last one as some themes have the text justified which makes it align to the left.
Thank you very much. I’ve also copy&pasted the CSS code.
Thank you for this information.
Thanks a lot, copy&paste and minor mods and, lots of time saved!
Thanks. Wondering why this isn’t inluded in WordPress since it is used. Strange. Anyway, just copy and paste and now it’s on the site.
Thank you, good information
Great! Now this feature works in my bloglauco.com.
However, I don’t understand why images with captions do not center in the page. This works when I set align LEFT or RIGHT, but not CENTER. Strange, isn’t it? Anybody could help me please?
Example: take a look at this post from my blog:
http://tinyurl.com/pv2pjz
Imagens are at left.
Hey, I could fix the code. It’s OK now. Thanks.
Great post! I’m using it in my blog now. I also stumbled it for you.
Many thanks for this.
Excellent code, looks very nice!
Do I make this change in my style.css file?
yes that’s correct
Thank you VERY much the help. The only things I needed to add were:
.wp-caption.alignleft{
float: left;
padding: 3px 3px 0pt !important
}
.wp-caption.alignright{
float: right;
padding: 3px 3px 0pt !important
}