WordPress.org

Ready to get started?Download WordPress

Forums

Wrapping text around images/2.7 (12 posts)

  1. laurachristianson
    Member
    Posted 5 years ago #

    I just upgraded from version 2.3.? to 2.7. When I insert an image and direct it to align right and wrap text around it, everything works fine in the dashboard. But when I preview and/or publish the post, the image reverts to align left and the text does not wrap.

    I am using a custom designed theme and the Shutter Reloaded 2.2 plugin.

    Any suggestions on how to get WP to put the image where I want it and wrap text?

    Here's a sample post where things are weird:
    http://heblogssheblogs.com/6-reasons-im-glad-i-canceled-my-newspaper-subscription/

  2. Samuel Wood (Otto)
    Tech Ninja
    Posted 5 years ago #

    Add this to your theme's style.css file:

    img.centered, .aligncenter, div.aligncenter {
    	display: block;
    	margin-left: auto;
    	margin-right: auto;
    	}
    
    img.alignright {
    	padding: 4px;
    	margin: 0 0 2px 7px;
    	display: inline;
    	}
    
    img.alignleft {
    	padding: 4px;
    	margin: 0 7px 2px 0;
    	display: inline;
    	}
    
    .alignright {
    	float: right;
    	}
    
    .alignleft {
    	float: left;
    	}
  3. laurachristianson
    Member
    Posted 5 years ago #

    I added the code you suggested to the end the style.css file. That fixed the problem of getting the image to align left or right, but the text still won't wrap around the image.

    Here's what it looks like now:
    http://heblogssheblogs.com/6-reasons-im-glad-i-canceled-my-newspaper-subscription/

    Laura

  4. CyberCoder
    Member
    Posted 5 years ago #

    I think the problem now is you started a new paragraph right after the image, which is forcing to start over.

    The image is in the paragraph with the text above it.

    And "Bottom Line" starts a new paragraph.

  5. Samuel Wood (Otto)
    Tech Ninja
    Posted 5 years ago #

    I added the code you suggested to the end the style.css file. That fixed the problem of getting the image to align left or right, but the text still won't wrap around the image.

    I just checked, and that code is not in your style.css file. If it was, then the text will wrap properly. Really.

  6. CyberCoder
    Member
    Posted 5 years ago #

    LOL, My Bad, I assumed the stylesheet had been changed, Otto42 is right, it will work, I thought that was strange.

  7. laurachristianson
    Member
    Posted 5 years ago #

    I'm sorry for the confusion. I deleted the code right after posting this message, because when I added it, it screwed up the look of the entire blog! It converted the entire theme to a document that looked more like a Word document -- everything was lined up underneath the next element. So we reverted to the previously saved version of the theme.

    I am not a CSS person and am not a techie -- where, exactly, should I insert the code in the style.css file? Maybe I'm putting it in the wrong place? I was using my FTP program to insert it and put it before the end body tag.

    Is this image alignment and text wrapping issue global with WP 2.7? Is it because I'm using a custom-designed template? Or is it just me? :-)

  8. Samuel Wood (Otto)
    Tech Ninja
    Posted 5 years ago #

    I am not a CSS person and am not a techie -- where, exactly, should I insert the code in the style.css file? Maybe I'm putting it in the wrong place? I was using my FTP program to insert it and put it before the end body tag.

    Not sure what you mean by "the end body tag". Just copy and paste what I gave you onto the very end of the style.css file.

  9. charissaproctor
    Member
    Posted 5 years ago #

    didn't work for me either, I put the code in and it did nothing, so i removed it

  10. bonniekirk
    Member
    Posted 5 years ago #

    charissaproctor is right. Pasting the code provided into style.css does not fix the alignment problem. I think what may be getting missed here is the fact that within the editor the alignment appears to be correct. But when the page is displayed in either Internet Explorer or Google Chrome, the image appears at the left, with no text wrapping, no matter what alignment options have been selected.

    And I doublechecked. The css.style file change was saved. And I did not start a new paragraph after the image.

    Example: http://abetteradvocate.com/a-mouse-in-the-house-an-autistic-questions-perceptions-about-behavior/

  11. SLD
    Member
    Posted 5 years ago #

    Worked like a charm for me!
    Perfect. Thanks for the code.

  12. kevinburke2
    Member
    Posted 5 years ago #

    worked for me!

Topic Closed

This topic has been closed to new replies.

About this Topic