• Resolved richardrto

    (@richardrto)


    Usually, I can troubleshoot my own problems with a search but this one has me in quite a bind.

    Basically, images at the end of posts flow outside of the content area, but the ones in between text are fine. I have a test page on my website that clearly shows this happening, which I don’t want. Problem shown here

    How should I make it so that the white area wraps around the image nicely at the bottom?

    Thank you so much in advance.

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

    (@stephencottontail)

    Try this code in your child theme’s stylesheet:

    .entry-content:after {
    	content: '';
    	display: table;
    	clear: both;
    }

    What’s happening here is that the bottom image is floated right, taking it out of the document flow, so the browser doesn’t include the image when determining the height of the container. Clearing the float here fixes the issue.

    Thread Starter richardrto

    (@richardrto)

    Thank you Stephen, but it didn’t quite work. I added it, then again under the existing .entry-content after it didn’t work and still does not display correctly. I checked for syntax errors. I should say that when I had the sharing buttons from Jetpack at the bottom of posts enabled, it seemed to work out nicely. I don’t have a use for those buttons anymore though and so took them out.

    The page does display correctly for a split second when it’s refreshed but then pulls back to the end of the text.

    Thread Starter richardrto

    (@richardrto)

    I finally fixed the issue when I fiddled with the class that the image was using to:

    .alignright {
    	display: block;
    	float: none;
    	margin-left: auto;

    Not sure if this will present problems later on, but I guess everything’s fine until then. Thank you once again Stephen!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Images at the end of posts flow outside the content area’ is closed to new replies.