Image Caption Issues

  • Hello,

    I am creating a new design for an old site.

    I’m having trouble with captioned images. Ideally images should have a little padding and a 1px border around them when aligned right. I’ve used the following CSS:

    .alignright {
    border: 1px solid #c5c5c5;
    float: right;
    margin: 0 0 .5rem .5rem;
    padding: .2rem;
    }

    However, when an image has a caption, there ends up being too much padding to the right of the image, which doesn’t look good: https://dev.leavingworkbehind.com/about/.

    Any ideas how I can fix this?

    Cheers,

    Tom Ewer

Viewing 3 replies - 1 through 3 (of 3 total)

  • That’s because the div around the image and caption has explicit width of 290px which doesn’t match the image width. If you can change it to 280px you’ll get the desired behaviour.

    P.S. The dirty way to fix this would be by adding width: 280px !important; to .alignright class. But it’s better to fix the theme, methinks.

    Thread Starter Tom Ewer

    (@tomewer)

    You’re right. The problem is that I’m not setting that width.

    In the text editor the code is:

    [caption id="attachment_6280" align="alignright" width="280"]

    On the front end the corresponding code is:

    <div id="attachment_6280" style="width: 290px" class="wp-caption alignright">

    For some reason WordPress is turning 280px into 290px. Any idea why?

    Thanks!

    Well, this is beyond my understanding, but it looks like the width you set is always increased by 10. x_x

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Image Caption Issues’ is closed to new replies.