Twenty Eleven Caption Border

• 

  nefertizahra · Member · Jan 14, 2012 at 12:12 am

  • Copy link
  • Add topic to favorites

  Hi,

  I have been long-plagued by the ugly border of captioned photos in Twenty Eleven. I don’t know CSS (I have the upgrade, but lotta good it does me since I don’t know CSS), or HTML. I mean, I know the most minimally basic HTML – remedial HTML, if you will, but have no idea how to get a caption without that hideous border.

  I saw the most perfect solution in the Coraline theme on another site (http://onecowboysway.wordpress.com/) where the caption is in a nice little box below the photo. I would give anything to have that caption option. Can I, in Twenty Eleven? Because the Coraline theme is not the one I want – I only want its way of presenting captioned photos.

  Does anyone have a magic pill solution to this dilemma? Here are some link to examples on my site of just how hideous the Twenty Eleven borders are in my posts:
  http://sylverblaque.wordpress.com/2012/01/13/diary-of-an-american-girls-journeys-to-the-forbidden-land-excerpt-7/
  http://sylverblaque.wordpress.com/2011/09/25/memory-of-madagascar-rainforest/

  Thanx!

  The blog I need help with is: (visible only to logged in users)

• 

  panaghiotisadam · Member · Jan 14, 2012 at 1:37 am

  • Copy link

  Try pasting this into your CSS editor and see if you like it:

  .wp-caption {
  background: transparent;
  margin-bottom: 0.1em;
  }
  
  .wp-caption .wp-caption-text {
  text-align: center;
  background-color: #f3f3f3;
  border:1px solid #ddd;
  margin: 0 4px 0 6px;
  padding: 5px;
  }
  
  .wp-caption .wp-caption-text:before {
  display:none;
  }
  
  .wp-caption img {
  border: none;

• 

  nefertizahra · Member · Jan 21, 2012 at 7:54 pm

  • Copy link

  Hi, thanx for this but I don’t understand what CSS will do. If I just copy/paste this in to replace the text already in my CSS stylesheet box (it’s the default, I guess), will it change only my photo borders? In both old & new posts? Or will it change everything everywhere?

  Just trying to understand what this will do, because I won’t know how to undo it & I like everything on my blog the way it is except for the photo borders….

• 

  thesacredpath · Member · Jan 21, 2012 at 8:04 pm

  • Copy link

  What is in the CSS edit window at first is just informational text. Delete that and past in the code Panos gave and that will change all captioned images, old and new.

• 

  nefertizahra · Member · Jan 21, 2012 at 8:04 pm

  • Copy link

  @panaghiotisadam Thank you! :) I figured everything out & pasted in your code – it looks exactly the way I wanted in all captioned photos in all posts. Thanx so much for your help, I really appreciate it!

• 

  nefertizahra · Member · Jan 21, 2012 at 8:06 pm

  • Copy link

  @thesacredpath, Thank you! I wasn’t sure if I should delete that info text, but did anyway to paste Panos’ code. You guys have made me very happy today : – > Have a great weekend!

• 

  thesacredpath · Member · Jan 21, 2012 at 8:33 pm

  • Copy link

  You are welcome and you too.