Need help? Check out our Support site, then


WordPress.com Forums » Support

Problems with layout: Multiple pics, each with para text

  1. digireado
    Member

    Hello, I have a drafted blog posts that require me to have an image and a paragraph of text relating to each image. I'm having ongoing issues trying to stop the images cascading across the wide of the page, and returns I'm entering not showing. I work in Visual not HTML so I'm not aware of any strange coding issues. But it's NOT WYSISYG, wht is showing in the Visual is different from what is displayed in draft mode.

    This is currently in draft form, do I need to publish as 'Private' or anything to get advice on this?

    The blog I need help with is digireado.wordpress.com.

  2. 1tess
    Moderator

    I'm picturing that you want a photo on the left, with a paragraph beside it. Then another photo below with a paragraph beside it.

    So you will have to make a short visit to the html editor to make this work. After each pair of "photo / paragraph" you want to paste this code:
    <br style="clear:both;"></br>

  3. digireado
    Member

    Thank you so much - that fixed the problem! Another success story from the WordPress Forums :)

  4. 1tess
    Moderator

    You are welcome. I am happy to have helped.

  5. angelakryhul
    Member

    Hi Tess,
    My blog uses the Linen theme and I've tried using the code you supplied above.
    It's strange because it worked, but then the code is stripped out for some reason.

    Does Linen do this automatically? Should I use different code?

    Here is a link to the page where I'm having trouble: http://wp.me/PqBOT-iS

  6. justpi
    Member

    The code should be like this:
    <br style="clear:both;" />

    It will be stripped out if you insert at a point where it makes no sense. What exactly are you trying to change on the page you linked to?

  7. digireado
    Member

    Thought I'd loop back in. While my post looked fine in preview, now it's published I'm having some troubles again. This may be a case of code again - any recommendations to someone who works in visual? Did I put the code in the wrong place? Do I need different code to replace (in which case can you say 'delete....' and replace with '....' !

    My page is http://digireado.wordpress.com/2012/03/25/my-year-of-reading-australian-women-writers-aww2012/#comment-508

  8. timethief
    Member

    @digireado
    Why don't my images align the way I want them to?
    http://en.support.wordpress.com/images/image-alignment/
    http://en.support.wordpress.com/visual-editor/#alignment

    The alignment icons in the WordPress editor are for aligning text; they are not for aligning images. 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 two images to be side by side on the same line start by setting the alignment of both images to left. To prevent the staggered effect what you do is insert the following snippet of code into the HTML editor after each image/text pair:
    <br style="clear:both;" />

  9. digireado
    Member

    Thanks for this. Strangely enough, although I'd inserted the code earlier recommended, when I went back it wasn't there...? Perhaps like angelakryhul it was stripped out? So I've just gone back in and put this code you've recommended after each para (where I wish to align pic/text).

    It's working - now. So hopefully will stay that way ;)

  10. digireado
    Member

    ok, I went back into page to update. This is a post that will NEED to be kept up to date as it's a list. Guess what, the alignment is out and the code I'd inserted is - once again - not present. So I've put it back, but this time it is not playing nice and aligning.

    I totally believe it is ME (code is after all, surely, logical) so smarter-than-me-code-people, what am I doing wrong?!

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags