Wrapping Image with Text

  • nycgirl1

    (@nycgirl1)


    17 years, 2 months ago

    Ok, I’ve been procrastinating writing this for months since I’ve read some similar questions here and the answers where either down right rude or over my head, but here goes;

    I can not get my text to wrap around either side of an image. In the 2.7 version the left indent version makes it appear to work in my panel but it does not actually look that way online. What am I doing wrong? I saw some explanations that involve the main index? But I don’t want all posts to be formatted this way. I just want to be able to manually on each post choose where I want my image. I’ve tried making changes in the post/html tab but nothing seems to work.

    Any suggestions? Please keep in mind I am not a natural techie, so as simple as possible would be great.

    Thanks!
    http://www.39thandbroadway.com

Viewing 1 replies (of 1 total)
  • stvwlf

    (@stvwlf)

    17 years, 2 months ago

    Hi

    I could only find one image on your site that was narrow enough that I’d even want text flowing around it

    http://www.39thandbroadway.com/top-ten-shopping-partner-tips/

    The HTML code for the image is
    <p><img width="238" height="449" alt="bagman" src="http://www.39thandbroadway.com/wp-content/uploads/2009/02/bagman.jpg" title="bagman" class="alignnone size-full wp-image-808"/></p>

    When I added some styling to the <img> tag it accomplished what you want.
    <p> ><img style="float: left;" width="238" height="449" alt="bagman" src="http://www.39thandbroadway.com/wp-content/uploads/2009/02/bagman.jpg" title="bagman" class="alignnone size-full wp-image-808"/></p>

    You can add that yourself in the HTML tab on any post you want text flowing around. Float left means the image aligns left, text flows around it on the right. Float right is the reverse. You can add padding to put space between the image and the text.
    style="float: left; padding: 10px;"> puts a 10 pixel margin on all 4 sides of the image.

    you can also define a class in your stylesheet

    .left { float: left; padding: 10px; }
.right { float: right; padding: 10px; }

    Then whenever you want an image to float, instead of adding the style stuff you add <img class="left" src="/whatever..." /> and the styles defined in class left are applied to the image

Viewing 1 replies (of 1 total)

The topic ‘Wrapping Image with Text’ is closed to new replies.

Tags