Problems with pictures, text, and spacing

  • Unknown's avatar
    kacates · Member ·

    Hi,

    I’m fairly new to using WordPress, and I’m having a lot of problems with posting pictures and text in the same post. I’m trying to set up a post with images all aligned to the left, descriptions next to each image, and a space between each image-and-text grouping. But I’m not getting the spaces between each group, so instead I’m ending up with something very wonky-looking. Here’s an example: http://normalteens.wordpress.com/2009/06/26/new-fantasy-and-supernatural/

    I tried to go into html and just add breaks after each image set, but after I updated the post, the breaks just disappeared completely from the code, and the resulting post looked exactly the same as before. What am I doing wrong here? It’s very frustrating – I’ve used other blogging sites and software before and never had this problem. Help!

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    thesacredpath · Member ·

    With text wrap on the web (HTML standards) if you insert an image the text (successive paragraphs including images) will continue to be put beside the first image until the text goes past the end of the first image. The same will occur with successive images resulting in what you are seeing. It is the way that paragraph formatting is defined in the HTML standards.

    The best way to do what you are wanting is to use a table with two columns and as many rows as needed, but that takes some HTML knowledge. If you want to go the table route, google “online table generator” and you will find several online resources that you can use to generate the basic table code and then copy and paste it into the HTML tab in the editor and then switch back to the visual editor where you can put the images and text into the table. Alternately if you are using Windows, download and install the Windows Live Writer blog client which will allow you to create and populate tables easily without any knowledge of HTML: http://windowslivewriter.spaces.live.com/ .

    The other way is to use some HTML/CSS tricks to add space below the last paragraph you want beside the image such as is outlined in this blog post: http://wpbtips.wordpress.com/category/line-breaks/ .

  • Unknown's avatar
    panaghiotisadam · Member ·

    If you decide do go html, the table code you need is this:

    <table border="0">
<tr style="padding-bottom:3.4em;"><td>1st_IMAGE_CODE_HERE</td><td>1st_TEXT_HERE</td></tr>
<tr style="padding-bottom:3.4em;"><td>2nd_IMAGE_CODE_HERE</td><td>2nd_TEXT_HERE</td></tr>
AND_SO_ON
</table>

    With this version, the texts will be vertically centered in relation to the images. If you want them aligned with the top of each image, then instead of
    <td>
    you need
    <td valign="top">

    Also, 3.4 is just an example: you can change the number to adjust the blank space below each image.

  • The topic ‘Problems with pictures, text, and spacing’ is closed to new replies.