Archived topic
Featured Image top Padding on Mobile
3 replies · Started by Jatin on February 12, 2021
Hi Guys,
I just checked and found the featured images when viewed on Mobile phone are getting cropped a little from the top. I checked and tried to search for top paddinig option but could not find it. Can you please let me know how to add some space from the top so that it does not break the images.
Its only happening on the mobile.
Below code i am using for mobile featured image:
@media(max-width: 768px) {
.post-image img {
width: 100% !important;
height: auto;
-o-object-fit: cover;
object-fit: cover;
}
}Hi there,
use this CSS instead:
@media(max-width: 768px) {
.resize-featured-image .post-image img {
width: 100%;
height: auto;
}
}Hi David,
I replaced the code, it did enlarged the Featured Image as opposed to before and also there is no top padding which as shown in the screenshot. I want to add some space on the top as the featured image is almost touching the container block.
You already have this CSS which is adding 5px of space to the top of the article:
@media (max-width: 768px) {
.separate-containers .inside-article {
padding-top: 5px !important;
}
}