Add space around image caption once border is eliminated?

  • Resolved bamster

    (@bamster)


    8 years, 9 months ago

    I’m trying to add space around the image+caption units that I add to Posts and Pages by using Add Media to a Text Block within the WYSIWYG Visual Editor.

    I have the Enfold theme. On this theme as installed, WordPress’s default style for images+captions features the caption below the image and a visible border around the entire image+caption unit.

    I wanted to get rid of the visible border. I got rid of it by using this CSS code recommended on the Enfold Support Forum:
    div .wp-caption {
    border: none;
    }

    But now that there is no border, the text wrapping around the image+caption is wrapped too tightly for my website’s style. I want to be able to add space between the wrapping text and the image+caption unit. I want to add the space sometimes on the bottom or top of the image, sometimes on the sides.

    I have the Advanced Image Styles plugin. But when I use it to add margins, it reads only the image, not the image+caption unit. So for instance when I add a bottom margin, space gets added between the image and the caption, not between the image+caption unit and the wrapping text.

    Example: the photo of the glass vases on this page. I have inserted 50px bottom margin using Advanced Image Styles.
    https://marketvolt.net/mac/missouri-arts-awards-2016/

    I tried changing the code to “border: hidden” but it has no effect.

    Without the ability to adjust the spacing around the entire image+caption unit, the caption feature is essentially useless.

Viewing 4 replies - 1 through 4 (of 4 total)
  • Moderator Steven Stern (sterndata)

    (@sterndata)

    Volunteer Forum Moderator

    I looked at your site and the spacing around images looks OK to me, except for this one image that has a 50px bottom margin

    https://dl.dropboxusercontent.com/1/view/da1ikgg76sp8g8x/Apps/Shutter/Selection_01_2016_05_27_13%3A20%3A33.png

    Thread Starter bamster

    (@bamster)

    Right – sorry I didn’t make that clear! I made the 50px bottom margin on purpose to show the problem. I inserted that image via the WYSIWYG editor. On that image, I added 50px to the margin on the image to show how the margin shows up between the image and the caption, not between the image+caption and the wrapping text.

    On all the other images, I used Enfold’s Avia Layout Builder with varying numbers of columns, an Image media element, and a Text Block element for the caption. Those work fine. But sometimes I want to wrap text and that’s why I would love to get this caption/text-wrapping issue solved.

    a style like this should add a general margin around all right-aligned captured images:

    #top .wp-caption.alignright { margin: 50px 0 50px 50px; }
    Thread Starter bamster

    (@bamster)

    Exactly what I need! Thank you so much!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Add space around image caption once border is eliminated?’ is closed to new replies.