How to flush side-aligned images before the end of an h3 section?

Rate this post

I am preparing in html a post that will be published in a wordpress website, with a lot of right-aligned images. I’d like the images to appear within the <h3> section where they are inserted, that is, that the following <h3> title is always below an image whose code is inserted above.

<h3>Section One with image</h3>
<img src="image-not-found.jpg" align="right" width="50%" />
Text here is short.
<h3>Section Two without image</h3>

I have tried surrounding the <img> tag with <p> or <div> but this doesn’t prevent the following <h3> title to be side-by-side with image.

Is there a way in HTML to request that all images be flushed before displaying further text?

Note that I do not have admin rights on the wordpress site.



I have found a quick and dirty hack for this.

Before the <h3> tag, insert a placeholder image of 100% width and zero or 1 height:

<img src="notfound.png" width="100%" height="0">

I am not sure how robust that is.

Leave a Reply

Your email address will not be published.

Back to top button