Support » Fixing WordPress » Problem with gallery/image spacing

  • najel

    (@najel)


    Hello all!
    I have a bit of a problem placing a gallery or individual images in my wp site. I have read a lot of entries in here and have gotten some ideas, but nothing has really worked so far.
    The website in question is: http://pkwedding.najel.de/?page_id=36
    I currently have two sets of images on there.
    The one on top is a gallery including three images (just the gallery that comes with WP). This would work just fine for my purposes, but as you can see, it leaves a large white space under the gallery. It does that when there is just text underneath too. I have not been able to get rid of this large gap. I found some info on changing the style.css file, but the one for my template does not have any of the gallery styles in it.
    The second set of images is individual images inserted into a table, like so:

    <table>
    <tr>
    <td>[caption id="attachment_77" align="alignnone" width="150" caption="The church"]<a rel="attachment wp-att-77" href="http://pkwedding.najel.de/?attachment_id=77" target="_blank"><img class="size-thumbnail wp-image-77 " title="The church" src="http://pkwedding.najel.de/images/DSC02881-150x150.jpg" alt="The church" width="150" height="150" /></a>[/caption]</td>
    <td>[caption id="attachment_79" align="alignnone" width="150" caption="View from the altar"]<a rel="attachment wp-att-79" href="http://pkwedding.najel.de/?attachment_id=79" target="_blank"><img class="size-thumbnail wp-image-79 " title="View from the altar" src="http://pkwedding.najel.de/images/DSC02887-150x150.jpg" alt="View from the altar" width="150" height="150" /></a>[/caption]</td>
    <td>[caption id="attachment_78" align="alignnone" width="150" caption="Inside of the Church"]<a rel="attachment wp-att-78" href="http://pkwedding.najel.de/?attachment_id=78" target="_blank"><img class="size-thumbnail wp-image-78 " title="Inside of the Church" src="http://pkwedding.najel.de/images/DSC02885-150x150.jpg" alt="Inside of the Church" width="150" height="150" /></a>[/caption]</td>
    </tr>
    </table>

    The problem here is, as you can see, that it now spaces the images farther apart than in the gallery and it now overlaps the sidebar. I would be very happy if someone could help me out with this. If someone knows how I can get the gallery to display without the whitespace, that would be my preferred option. Decreasing the spacing of the images in the table would be great, too though!

    Thanks,
    Phil

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

    (@esmi)

    Forum Moderator

    Get rid of the table markup and just align the 3 images left. The gap is being caused by the table which is too large for your content area.

    najel

    (@najel)

    Thanks, I just tried that. When I align the three images left (I have done so now below the first two sets), it will only display two in a row and set the other one below. It will also wrap the text and the map overlaps.

    esmi

    (@esmi)

    Forum Moderator

    Then you need to either reduce the padding around your captioned images or increase your content area. There simply isn’t enough room for 3 captioned images at present.

    najel

    (@najel)

    OK, I will try that. I am just confused why the gallery can fit three images next to each other, but I can’t. I don’t see anything in the style of the gallery that would reduce the padding, or am I blind?
    Anyway, I will play around with it a little more, thanks for your help!

    esmi

    (@esmi)

    Forum Moderator

    Because individually captioned images have different CSS (style/margins/paddings). Edit style.css and change margin: 10px; to margin:10px 0; in:

    .wp-caption {
        background-color: #F5F5F5;
        border: 1px solid #DDDDDD;
        margin: 10px;
        padding-top: 4px;
        text-align: center;
    }
Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Problem with gallery/image spacing’ is closed to new replies.