Post Featured Image overlaps Title

  • Resolved MsLake

    (@mslake)


    8 years, 7 months ago

    I haven’t used featured images in my posts before but I want to start to in order to make some grid pages for different categories. When I insert the featured image, it overlaps the post Title and gets cut off. How can I fix this?

    FYI: I have made some adjustments to the width of the theme via my css editor recently, but I don’t think this is a factor as it’s the height that isn’t working, not the width.

    Also would like to extend the width of the theme almost all the way across, with maybe a centimeter of padding on either side. I’ve tried looking at the css in my css editor but I can’t figure it out. Ever since the theme update the post area and sidebar are almost up against each other. I want to widen the them and move both areas further away from each other.

    My site is MsLake.me

    I also need to know how to adjust the margin between the content and the outer edges of the content area. I want to cut the margin all the way around by 1/4 inch or more. I am using site origin css to make the changes, thank you.

Viewing 6 replies - 16 through 21 (of 21 total)
  • Moderator Kathryn Presner

    (@zoonini)

    I took a look at your screenshot and I still don’t see any overlapping of the site title over the featured image.

    If you look at all the screenshots I’ve been posting, they look the same as yours, right?

    I think there’s been a misunderstanding, as this is how Sela is designed to display. Have a look at the single post here:

    https://selademo.wordpress.com/2011/09/20/some-much-needed-vacation/

    The featured image is displayed in a sort of L-shape, with the post title tucked into the elbow.

    Are you wanting to remove that L-shape and make featured images a plain rectangle shape instead?

    Thread Starter MsLake

    (@mslake)

    OMG, this is time I’ve seen that, LMAO. I am so sorry. But yes, please I’d like a plain rectangle because I often use text in my images. Wow. I’m so sorry about this.
    BTW my site looks exactly how I want it to in Microsoft Edge browser. Full-width, spacious and beautiful. It’s like another planet, so you are right about Chrome.

    Moderator Kathryn Presner

    (@zoonini)

    Luckily this should be an easy tweak. ??

    If you add this to your custom CSS editor it should override the negative top margin on the featured images, which is what creates that L-shape effect:

    .post-thumbnail + .entry-header {
  margin-top: 0;
}

    I used my browser inspector to make this change on the Sela demo, and you can see the result here:

    Some much needed vacation Sela

    Thread Starter MsLake

    (@mslake)

    Thank you so much and i’m sorry this went on so long.

    Moderator Kathryn Presner

    (@zoonini)

    You’re welcome – glad you’re set. I’m marking this thread as resolved.

    Dear Kathryn,

    Sorry for posting here, but I’m having the exact same problem as MsLake, and I tried using the code you gave her (I used the Jetpack CSS editor), and it didn’t work. This is my site:
    https://www.collaborativepianoinstitute.org/

    Thank you so much!

    • This reply was modified 8 years, 1 month ago by amos13.
Viewing 6 replies - 16 through 21 (of 21 total)
  • The topic ‘Post Featured Image overlaps Title’ is closed to new replies.