Archived topic

How to remove padding from featured image on mobile only in single posts

3 replies · Started by Puneet on April 27, 2022

Viewing posts 1–4 of 4

April 27, 2022 at 10:07 am #2201981

Hi
Currently, this is how the single post featured image looks on a mobile device:-

How do I remove the padding from its sides so that it applies only on mobile and not on desktop? It's not happening through the customizer. If I tick the padding off, then it goes off for all devices. Want to achieve something like this on mobile:-

https://snipboard.io/TBmzc9.jpg

Thanks and regards,
Puneet

April 27, 2022 at 10:30 am #2202005

Hi there,

try adding this CSS:

@media(max-width: 768px) {
    .single-post .featured-image {
        margin-left: -30px;
        margin-right: -30px;
    }
}

the negative margin values should equal the same px value as you have for your mobile container padding.

April 27, 2022 at 10:46 am #2202015

Hi David,
Works perfectly, thanks.

Regards,
Puneet

April 27, 2022 at 12:19 pm #2202076

Glad to hear that

This archived topic is closed to new replies.

Start building better websites today.