Archived topic
Adjust featured image padding in mobile
5 replies · Started by Alvaro on September 19, 2017
Hi,
I used this to remove padding from featured image in the blog page. But it doesn't work well when I use a different padding for mobile.
Example: I'm using 40 for content spacing and 30for content spacing in mobile, in the customizer Layout module.
So, the images look fine in desktop but appear oversized (to the right) in mobile.
Also, what should I change so that the featured image also appears without padding in single post and page?
Thanks.
Álvaro
Hi there,
This will actually be an option in the customizer in the next version of GPP :)
Can you link me to the site? Thanks!
Can you try wrapping the CSS in like suggested in this page:
https://docs.generatepress.com/article/responsive-display/#responsive-breakpoints
So you should have two blocks that are basically the same but wrap in different media query.
Let me know if this makes sense.
Wow, nice. Working fine now: https://staging.homesosimple.pt/blog/
What should I change to get a featured image without padding in single post and page?
Thanks.
Álvaro
Try this CSS:
.page-header-image-single {
margin: -40px -40px 2em -40px;
}
.single.separate-containers .inside-article {
padding-top: 0;
}