[Resolved] Delete padding on featured images

Home Forums Support [Resolved] Delete padding on featured images

Home Forums Support Delete padding on featured images

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1539853
    Kia

    Hi there,

    I’d like to delete the padding around my featured images.

    Desktop
    On desktop, I’d like to delete padding-left and padding-top so that this looks like this. Example post: https://www.atlasandboots.com/travel-that-changed-roz-watkins.

    Mobile
    On mobile, I’d like to delete padding left, top and right.

    As the padding is created by the container, I’m not sure how to delete it short of adding minus-padding on the image which of course isn’t particularly elegant. Do you have any ideas please?

    Thank you,

    Kia

    #1540123
    David
    Staff
    Customer Support

    Hi there,

    try adding this CSS:

    @media(min-width: 769px) {
        body.single-post .inside-article .page-header-image-single {
            margin-left: -40px;
            margin-top: -40px;
        }
    }
    
    @media(max-width: 768px) {
        body.single-post .inside-article .page-header-image-single {
            margin-left: -30px;
            margin-right: -30px;
            margin-top: -30px;
        }
    }
    #1540931
    Kia

    Hi David,

    Thank you. That worked really well.

    However, there is one problem. On the mobile version of our main blog page and archive pages, the featured image now has a margin on the right-hand side (see image).

    I presume I need to apply a -30px margin to fix this but I’m not sure what’s the best the best class to target. Can you help please?

    Thank you,

    Kia

    #1541188
    David
    Staff
    Customer Support

    The CSS i provided only applies to the Single Post – Can you disable your cache plugin so i can see whats happening ?

    #1541194
    Kia

    Thanks, David.

    I’ve deactivated WP Rocket so you should be able to see the problem now. We’ve been making a few changes to the site so it may be that something else has caused it but I’m pretty sure we haven’t changed anything image related.

    Thank you,

    Kia

    #1541201
    David
    Staff
    Customer Support

    Try adding this CSS to fix that:

    @media(max-width: 768px) {
        .one-container.right-sidebar.post-image-aligned-center .no-featured-image-padding .post-image {
            margin-right: -30px;
        }
    }
    #1541203
    Kia

    Perfect. Thank worked. Thank you!

    #1541219
    David
    Staff
    Customer Support
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.