Text/Image Wrap

  • Author
    Posts
  • #365343

    lorenwade
    Member

    I can’t seem to figure this one out. I think it’s my coding, but for some reason I cannot get the text to wrap around my images. It works in the “New Post” box but does not display properly.

    Any suggestions? I can make a test post if you guys need.

    The blog I need help with is brokenandglowing.com.

    #365597

    When you insert the image, are you selecting “left” alignment or are you leaving it set to “none?”

    #365613

    lorenwade
    Member

    I’ve tried left and right, no go.

    #365615

    Can we get a link to a post where this is happening?

    #365634

    lorenwade
    Member

    Sure, here it is.

    http://brokenandglowing.com/test-page-lorem-ipsum/

    At the bottom of the page, you can see what I see in the edit window.

    #365635

    ellaella
    Member

    I get a 404 from that link. Have you published it?

    #365665

    lorenwade
    Member

    I’m sorry, here’s a new page I made.

    http://brokenandglowing.com/2009/01/28/test-post/

    The link is at the bottom of how it should be (except the pictures are swapped now).

    Thanks again.

    #365668

    pdalbury
    Member

    insert image to post… while in the post edit mode… click on edit image (top left corner of image)… click on Advanced Settings tab… in the Advanced Image Settings section the “CSS class” needs to see: alignleft wp-image

    #365669

    pdalbury
    Member

    Another way to word-wrap an image is:
    in HTML edit mode locate the image code

    It’ll look something like <img src="" alt="" width="200" height="375" />
    add class=”alignleft wp-image”

    so it looks like:

    <img class="alignleft wp-image" src="" alt="" width="200" height="375" />

    that should do it

    #365671

    1tess
    Moderator Emeritus

    lorenwade

    Source code works all right in my test blog:
    <a href="http://brokenandglowing.files.wordpress.com/2009/05/photo.jpg"><img class="alignright size-medium wp-image-145" title="photo" src="http://brokenandglowing.files.wordpress.com/2009/05/photo.jpg?w=200&amp;h=300" alt="photo" width="200" height="300" /></a>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi varius odio nec arcu auctor interdum. Morbi tristique tellus fermentum diam ullamcorper auctor. Nunc elit nisi, ultrices sit amet malesuada eu, ornare eu sem. Maecenas ac nisl sed nibh dictum imperdiet in eu mi. Cras placerat leo non lectus ultrices hendrerit…
    Could there be something in your CSS that over-rides image alignment? (I know nothing about CSS)

    #365672

    pdalbury
    Member

    … your code works fine on my site… even if the photo is right align. i use “Rubric” theme.

    try stripping the code back:

    <img class="alignleft wp-image" src="http://brokenandglowing.files.wordpress.com/2009/05/photo.jpg?w=200&amp;h=300" />Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi varius odio nec arcu..

    #365673

    lorenwade
    Member

    This is so weird.

    I checked the advanced image settings and they look right.

    Why would it work fine in a test blog, but not on mine? There has to be something in my CSS causing this override. Thanks for the input you guys. I’ll keep searching.

    #365674

    ellaella
    Member
    #365679

    lorenwade
    Member

    My problem lies herein: if I do use that workaround, I will have to do so for every image and that’s ridiculous. I shouldn’t have to. I should be able to edit the CSS appropriately so it works every single time like it’s supposed to. I want 100% transparancy between the editor and the actual post.

    #365686

    bigdave44
    Member

    @lorenwade

    I have been wrapping text around images for a few months, but recently it has become a nightmare. It would seem that some changes have been made to the editor as I have found certain other differences, e.g. if you cut and paste text that includes the “more” indicator from the Visual display, the indicator is no longer carried across (it works OK from the HTML display).

    Because of this I now set the image as a background, thus avoiding rather than solving the problem.

    #365696

    lorenwade
    Member

    Okay, thanks for the input Bigdave.

    #365697

    aw1923
    Member

    try adding this to your CSS.

    .alignleft,div.nav-previous {
    float:left;
    }
    
    .alignright,div.nav-next {
    float:right;
    }

The topic ‘Text/Image Wrap’ is closed to new replies.