Align text in blog

  • Author
    Posts
  • #1168417

    OK I use the Word publish from kitchen sink and sometimes it works sometimes it doesn’t.

    How do I keep my alignment of my written content??

    See http://www.chilecopadevino.com

    Look at the Jan 4th Altair entry and the Dec entries the last line wraps to the left, how do I stop this????

    The blog I need help with is chilecopadevino.com.

    #1168501

    ciencias4all
    Member

    That happens because the text longer than the height of the image so the text “wraps” the image and the next lines goes down the image… try to enlarge the image a little, or try to reduce the ammount of text on each of that posts…

    Best Regards.

    #1168504

    Thanks but those solutions don’t work for me, first I what consistency on the blog, so different sized pictures are out (besides I tried that, it looked bad) and secondly, I write what is necessary, shorten a wine review!!!! Mine are short and to the point as they are.

    Can I use columns in the post??? Or something else that is simple, I don’t write code.

    #1168508

    ciencias4all
    Member

    I gotta agree, i am very fond of consistency myself and i really think your reviews are quite short, but that is just characteristic of the text orientation, you may try using tables, but that would need a little knowledge on HTML, if you structure tables inside your post like, first cell on the left the image, next cell the text, it will not happen that thing like text going left under the image.

    Best regards.

    #1168509

    timethief
    Member

    Have you tried using windows live writer? https://en.support.wordpress.com/xml-rpc/windows-live-writer/

    #1168510

    timethief
    Member

    Copying and pasting text from elsewhere without using either icon 5 or icon 6 in Row 2 of the visual editor is always an issue. See: http://en.support.wordpress.com/visual-editor/#pasting-text

    Have you done what follows?

    Go to Settings > Writing and select “ ___ WordPress should correct invalidly nested XHTML automatically” and then scroll down and click “Save Changes.”

    Posts > All Posts, change all your latest posts to Draft, click Update, change them back to Published, click Update again. (You can edit all 3 of them at once: tick the square in front of their titles then select Edit from the Bulk Actions dropdown and click Apply.)

    re: image alignment and text wrapping
    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).

    Every theme has a maximum displayed image width http://wpbtips.wordpress.com/2009/07/23/maximum-image-width/ so it’s important to keep that in mind when posting multiple images side-by-side. 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:
    <p style="clear:both;">TEXT HERE</p>

    #1168520

    What I see is non justified left in the visual when setting up a post (not wrapped), then the last line justifies left if the post is over 8 lines long, is there a bit of code I could use WHEN it justifies left under the photo to hold it as a column? The link I want lower and justified left.

    #1168524

    timethief
    Member

    Did you read what I posted?

    #1168529

    Yes and I looked at the pages and reset the ” ___ WordPress should correct invalidly nested XHTML automatically” and then scroll down and click”

    I never post images side by side, so that I didn’t look into.

    What you are saying is I’m SOL ;)

    #1168530

    “Posts > All Posts, change all your latest posts to Draft, click Update, change them back to Published, click Update again. (You can edit all 3 of them at once: tick the square in front of their titles then select Edit from the Bulk Actions dropdown and click Apply.)”

    Tried this on one offending post, it didn’t do anything

    #1168531

    timethief
    Member

    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.

    To prevent the staggered effect what you do is insert the following snippet of code into the HTML editor after each image/text pair:
    <p style="clear:both;">TEXT HERE</p>

    #1168532

    timethief
    Member

    Please post an active link starting with http:// to the post with this issue in it.

    #1168536

    Thanks here is the code…..Wher does it go?

    <img class=”alignleft size-thumbnail wp-image-851″ alt=”IMG_0594″ src=”http://chilecopadevino.files.wordpress.com/2012/12/img_0594.jpg?w=112″ width=”112″ height=”150″ />Grape variety: Cabernet Sauvignon 75%, Carmenère 17%, Merlot 6%, Syrah 3%, Cabernet Franc 1%
    <p style=”text-align:justify;”>Outstanding wine with mixed ripe red/black raspberries and black cherries over a complex of baking spice, cocoa and sweet herbs. The fruit has very good concentration and medium plus intensity. The wine has very good structure, great complexity and a long finish. Drink now, will improve for 3-4 years then drink for 7-10 years.</p>
    http://www.altairwines.com/

    #1168539
    #1168695

    ciencias4all
    Member

    chilecopadevino, try using HTML tag table:

    <table width=100%>
    <tr>
    <td width=(a little larger than image width)>
    [insert image here]
    </td>
    <td>
    [insert text here]
    </td>
    </tr>
    </table>

    its should work…

    Best regards

    #1168697

    justpi
    Member

    The table idea is correct, but the suggested coding isn’t. Should be:

    <table>
    <tbody>
    <tr>
    <td style="width:140px;vertical-align:top;">
    IMAGE CODE HERE
    </td>
    <td style="vertical-align:top;">
    REST OF CONTENT HERE
    </td>
    </tr>
    </tbody>
    </table>

    #1168698

    ciencias4all
    Member

    justpi the code i posted should work fine, <tbody> is not necessary and i don’t think that is necessary to use style to define width of column, the width property of td should be enough.

    #1168700

    justpi
    Member

    a) tbody isn’t strictly necessary but it will be added by the editor anyway.
    b) Specifying the table width the way you did would have no effect: you’d need the style attribute. But you don’t need to specify a 100% width anyway, because that’s the default in the theme the OP is using.
    c) In this theme (and in most of the newer ones), your coding would make the text start at the bottom of the image. So you need to add the style attribute to correct the vertical alignment.
    d) The td width would work the way you put it, but since you have to add the style attribute because of c, there’s no point specifying the alignment one way and the width another way.

    And I forgot that there are default borders as well. So it needs to be:

    <table style="border: none;">
    <tbody>
    <tr>
    <td style="width: 140px; vertical-align: top; border: none;">
    IMAGE CODE HERE
    </td>
    <td style="vertical-align: top; border: none;">
    REST OF CONTENT HERE
    </td>
    </tr>
    </tbody>
    </table>

    #1168701

    ciencias4all
    Member

    Well, you are talking about how wordpress need then… but still, i used <td width=”…”> on my blog and worked fine…

    #1168702

    raincoaster
    Member

    Only answers which work on WordPress.com are appropriate here. And styling depends on the theme: does your blog use the same theme?

The topic ‘Align text in blog’ is closed to new replies.