Styling caption boxes with CSS

  • Author
  • #254681


    Hi. I’ve done a search in the forums but I can’t find the exact answer to this simple question: What are the attributes (class, id, etc.) that I need to know to style the caption boxes that appear around images? Right now, my blog — — has a dark gray background. By default caption boxes appear as a light gray. It doesn’t really look right and I’d like to make the boxes with a black border and white or gray caption text. Thank you for your help. (I do have the custom CSS upgrade)



    Here are the basics of what is used. It may differ a little bit from theme to theme:

     div.aligncenter {
         display: block;
         margin-left: auto;
         margin-right: auto;
     .alignleft {
         float: left;
     .alignright {
         float: right;
     .wp-caption {
         border: 1px solid #ddd;
         text-align: center;
         background-color: #f3f3f3;
         padding-top: 4px;
         margin: 10px;
         -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;



The topic ‘Styling caption boxes with CSS’ is closed to new replies.