Can’t get text to wrap around image

  • mbboy

    (@mbboy)


    9 years, 3 months ago

    Since I’m new at this, I haven’t been able to insert an image on the right or left of a page in any theme so that text will appear next to it, rather than above or below it.

    I’ve tried every trick that people who had this problem said would correct it, and I tired putting the following code into my styles.css:

    img.alignright { float: right; margin: 0 0 1em 1em; }
    img.alignleft { float: left; margin: 0 1em 1em 0; }
    img.aligncenter { display: block; margin-left: auto; margin-right: auto; }
    .alignright { float: right; }
    .alignleft { float: left; }
    .aligncenter { display: block; margin-left: auto; margin-right: auto; }

    But nothing seems to work. Sometimes one line will appear next to the image, and the rest will appear above or below it.

    Since I can’t believe that doing something so simple can possibly be that hard, I was wondering if someone here could tell me what the trick is?

    Thanks very much in advance.

Viewing 3 replies - 1 through 3 (of 3 total)
  • lelandf

    (@lelandf)

    9 years, 3 months ago

    CSS floats are the right way to do this, but I’m guessing you have line breaks in your editor that are messing it up.

    Your code should look like this:

    <img src="path/to/image.jpg" alt="alt text" class="alignleft">Text here

    If it looks like this, for example:

    <img src="path/to/image.jpg" alt="alt text" class="alignleft">

Text here

    The “Text here” will be put in a new paragraph and not look how you want.

    Moderator Steven Stern (sterndata)

    (@sterndata)

    Volunteer Forum Moderator

    9 years, 3 months ago

    Please provide a link to a page on your site where we can see this. Thanks.

    Thread Starter mbboy

    (@mbboy)

    9 years, 3 months ago

    Thanx very much for the help, guys. I’m not really sure why I was having the problem, but it may have been because I was inserting the image between text I had already written, rather than before it. So, when I hit the “align left” button, some of the text appeared in front of the image and some of it appeared after the image.

    The code now looks like this:

    img src=”http://image location” alt=”” width=”225″ height=”300″ />Text

    I mistakenly assumed that WordPress worked like Wordperfect, which I’ve been using for years. In it, if I right click on a graphic, and hit “wrap left,” Wordperfect will move all the related text to the right. So, now I know better.

    While I have your attention, maybe you can tell me why the buttons on my text editor are unmarked rectangles, rather than icons. So, I have to hover over them to see what they are.

    • This reply was modified 9 years, 3 months ago by mbboy.
Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Can’t get text to wrap around image’ is closed to new replies.