Add space between captioned images

  • Resolved CharlyIBC

    (@charlyibc)


    10 years, 2 months ago

    Something so simple in versions prior to 3.9 now isn’t ?? Yes I have the latest version of Advanced Images Styles plugin install, but its left/right margins are set to auto and cannot be changed. Well unless I’ve overlooked something.

    Example page: Prints of Italy Store

    By adding css to make my images look correct, my responsive theme is off. The first row of images I have set to aligncenter and this is the CSS I put in:

    .aligncenter {
 margin: 15px auto;
 display: inline-block;
 text-align: center;
}

    Obviously it does not work. The captioned images should have space between them and align in center page. That is how it worked in 3.8 anyway….

    The following rows of images have custom CSS to get them aligned as you see, but that throws off the responsiveness. If you adjust your browser to small, the top row images will center, the rest are offset.

    How exactly does one make captioned images aligncenter with space between them in 3.9? Thanks in advance!

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

  • the captioned images in your linked web page are all ‘alignleft’.

    if you are referring to a different page, please post a direct link.

    Thread Starter CharlyIBC

    (@charlyibc)

    Thanks for the reply! The first row (3 images) are aligncenter. All the other images are alignleft till I figure out how to fix the first 3 images to look like the others. ??

    even the first three images on the linked web page are ‘alignleft’; i.e. those with ‘Assisi and Paestum Gallery’, ‘Rome and Ostia Gallery’ and ‘Cinque Terre Gallery’.

    make sure to clear the cache.

    and please enable ‘right-click’ if you want help with trouble shooting.

    Thread Starter CharlyIBC

    (@charlyibc)

    My bad, I had forgotten to update the page. Now they are center but still the CSS for margin on aligncenter didn’t work.

    Thanks for trying, but I think I have it now. I deactivated the Advanced Image Styles plugin and put in this:

    .aligncenter {
    margin: 35px 10px;
    display: inline-block;
    text-align: center;
}

    Although the first row is not center page, at least the images have spacing now. Might need to use a div to center the rows, but will play with it tomorrow; I’m done for the day. ??

    Thread Starter CharlyIBC

    (@charlyibc)

    I really dislike that now I have to enter more code in versions 3.9+ ?? Why WP would decide to go backwards instead of forwards is beyond me. As a photographer, using 3.8 is so much easier to work with images… That’s why I won’t upgrade WP on my other site

    Anyway, I figured this out if anyone else is interested. Here’s what I did:

    1. Deleted Advanced Image Styles plugin
    2. Aligncenter all images
    3. Use .aligncenter CSS as above
    4. Use div to center images on page in Text window

    <div align="center">
image info
image info
image info
</div>

<div align="center">
image info
image info
image info
</div>

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Add space between captioned images’ is closed to new replies.