Need help? Check out our Support site, then


WordPress.com Forums » CSS Customization

change the space between my images?

  1. viktorkrantz
    Member

    Hi!

    Can someone please help a me!? I´m kind of lost..

    I can´t find the code for changing the space between my images! It works fine when i put two pictures next to each others, but when i move down one line, i get this huge gap... what to do?

    /Viktor

    The blog I need help with is viktorkrantz.com.

  2. timethief
    Member

    The alignment icons in the WordPress editor are for aligning text; they are not for aligning images. http://en.support.wordpress.com/visual-editor/#alignment They are used to achieve wrapping text around images on either the right or left hand side, or to display an image that's centered without text on either side of it. If the text beside the images does not occupy the same amount of space that the image beside it does then the text wrapping will continue and the images and text that follow will have a staggered appearance.

    • Align-left means position left, with the rest of the content wrapping around the right side of the image.
    • Align-right means position right, with the rest of the content wrapping around the left side of the image.
    • Align-center means position center, with no wrap-around (= the rest of the content below the image).

    So if you want to prevent the staggered effect what you do is insert the following snippet of code into the HTML editor
    <br style="clear:both;" />

    See > For more on WordPress formatting and spacing

  3. designsimply
    Staff

    That gap is happening in your blog because the images are in separate paragraphs. You can remove that gap using CSS, but it will also removing spacing between paragraphs if you ever add several paragraphs of text in the future. Looking at your blog, that might be fine for you if you will always be posting images. You'll want to be careful with a change like this though and remember what you did if you add text paragraphs in the future:

    #core-content p {
    margin-bottom: 0;
}

    Another option would be to add the images in a gallery or add them all in a row in one giant paragraph and then float them left if needed.

    Try out a single column full width gallery to see if you like the way it looks:

    [gallery columns="1" size="large"]

    http://en.support.wordpress.com/images/gallery/

  4. designsimply
    Staff

    Your photography is really beautiful btw! You should add equipment info on an About page. :)

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags