Stop text wrapping under image

  • well14

    (@kl14)


    4 years, 11 months ago

    I’m trying to use WPSP to create lists of a custom post type with a thumbnail image to the left of the post content (the content is a brief paragraph).

    Is there a way to stop the text from wrapping under the image?

    Thanks!

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Support Elvin

    (@ejcabquina)

    4 years, 11 months ago

    Hi @kl14,

    The text wraps because the image container is set to float. We can change that with CSS.

    Can you link us to the page in question to inspect?

    Thread Starter well14

    (@kl14)

    4 years, 11 months ago

    Here’s a link to a sample page (in progress). Depending on the size of the browser window and the text description, the wrapping under the image occurs.

    Thanks!

    Thread Starter well14

    (@kl14)

    4 years, 11 months ago

    Here’s the link

    Plugin Support Elvin

    (@ejcabquina)

    4 years, 11 months ago

    We’ll have to do a flexbox row for this:

    Try this CSS:

    .wp-show-posts-inner {
    display: flex;
    flex-direction: row;
}

.wp-show-posts-image.wpsp-image-left {
    width: 30%;
}

.wp-show-posts-entry-content {
    width: 70%;
}

.wp-show-posts-image.wpsp-image-left img {
    width: 100%;
}
Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Stop text wrapping under image’ is closed to new replies.