Layout/ Format problems

  • Author
  • #1345404


    I was writing my first post on my new blog and placing pictures and dialogue in the layout that I liked on the post page. However, when i went to publish it onto the blog, the entire layout changed… pictures moved, writing/paragraphs jumbled together and in different areas. Does anyone know what could be causing this or why this is happening?
    My blog is, please help :)!

    The blog I need help with is



    Hi there,

    Please note that the post editor doesn’t display a post exactly as it will appear on your blog – that is why we offer a post preview option.

    I see you have only one post, and you’re currently editing it. Can you be more specific about how it did not appear correctly?


    Ive had to delete several pictures from the posting because they weren’t posting the way I would like. There were originally 3 ” tram” photos on the post, that were placed in a zig-zag formation from left- right-left and then writing underneath all 3 photos. When I went to pubish it, the pictures had moved and the writing was spread amongst the pictures rather than underneath it. Perhaps I can post it the way I would like and you can see how it appears in my post editor?



    Hope this helps.

    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).
    To prevent the staggered effect what you do is insert the following snippet of code into the HTML editor after each image/text pair:
    <div style="clear:both;"></div>



    I understand you want a series of images with some text side-by-side with each image.
    When you set the alignment of an image to left or right, the rest of the content is supposed to wrap around. So when the text you want side-by-side with an image is shorter than the image, the next image will also wrap around. To prevent this, switch the editor to Text (=code) and add this code after each image/text pair:
    <div style="clear:both;"></div>


    What if i add this code after just an image?


    Also, how do I switch the editor to Text/ code?



    There’s a tab at the top of the box where you write your posts to switch between visual and code editing.

    You may also prefer to use Windows Live Writer, which lets you tinker with the layout before it goes onto the blog in the first place.


    I’m having trouble distiguishing where to put the :

    <div style=”clear:both;”></div>

    in the text editor. It’s very overwhelming. Can anyone help :)



    Add it right after the image and text pairing you want.

    Code goes here

    Code goes here

    etc. If you aren’t comfortable working in code, you might just want to center the images. That’s what I do. It doesn’t look fancy but it’s faster by far..


    [post content redacted]



    Just put the code

    <div style="clear:both;"></div>

    before each image, and see if that helps.


    I’m having a difficult time with spacing too. When I publish my blog, the spacing gets all jumbled together. No matter how much spacing I do as I edit, the post will not change. I have used

    <div style=”clear:both;”></div>

    between the texts even and image and it hasn’t created more space.

    What to do???



    You can try telling us exactly what you want where instead of generalities.


    I just want more space between the paragraphs. It looks really sloppy now.



    The default spacing between paragraphs is the space you can see between “heard of this place!” and “The picture above”, and there’s nothing sloppy about it. The sloppiness is further down, it’s the result of your unfamiliarity with the effects of left/right-aligned images, and it becomes worse when you try to change things by entering extra paragraph breaks.


    well what do I do about it?


    “The default spacing between paragraphs is the space you can see between “heard of this place!” and “The picture above”, and there’s nothing sloppy about it. “

    This statement confuses me. Did you see my blog. All the paragraphs are run together. In my opinion, it looks sloppy. Also, what are you quoting, because I didn’t write “heard of this place!” and “The picture above” in my blog…

    I started another blog, cut and pasted everything, and left it without an image and it was still sloppy…or tight looking (without much space)



    Also, what are you quoting, because I didn’t write “heard of this place!” and “The picture above” in my blog…

    Sorry? Beginning of your post:

    WARNING: This post is VERY picture heavy…it’s a commitment..not as bad as a sit-down dinner with your parents, but I think you can handle it. Besides, it’s cool and I bet you haven’t heard of this place!

    The picture above
    is an aerial view of Roosevelt Island; [ETC ETC]

The topic ‘Layout/ Format problems’ is closed to new replies.