How to get text to wrap around images correctly

  • Resolved misskris

    (@misskris)


    9 years, 6 months ago

    Thanks for the great theme.
    I am having issues with inserting images into posts. I am trying to get the image to be aligned left, with all the text wrapped around it.

    I understand how to set the image alignment in the editor, and it looks the way I would expect in edit mode. However when I look at the post on my website, only part of the text is wrapped around the image. More specifically only the text from the first paragraph. The next paragraph jumps to below the image, leaving a bunch of whitespace.

    Looking at the html I can see the problem, the image is inside the first <p> tag along with the text. So that makes that paragraph the height of the image. What can I do to fix this? I want all paragraphs to wrap, not just the first one.

Viewing 1 replies (of 1 total)
  • Thread Starter misskris

    (@misskris)

    OK, I have solved my problem. There were a couple of things going on.

    1. My image was inside the first paragraph because when I inserted the image I had the cursor next to the first word. I had to hit enter and place the cursor in the line above the text. Easy enough, now the image is wrapped in it’s own p tag, but it still wasn’t wrapping correctly.

    2. In the style sheet on line 124 I found the following:

    p {
   color: #646464;
   margin-bottom: 1.5em;
   overflow: hidden;
}

    I changed it (in a child theme) to overflow:visible
    I’m not sure if that’s going to cause any problems elsewhere, but it solved the issue for me of the text not wrapping, and so far nothing else looks broken.

Viewing 1 replies (of 1 total)
  • The topic ‘How to get text to wrap around images correctly’ is closed to new replies.