Archived topic
Featured Image adjustments?
3 replies · Started by ammgbr on January 11, 2022
I have not yet managed to get the homepage featured image to display properly. It either does not occupy the full width of the screen or when I reupload it only partially uploads with areas missing. Is it possible to adjust the featured image with CSS?
Hi there,
The image isn't going full width because it's being restricted by the site's default max-width of 1200px.
You can try bypassing that on the homepage by adding this cSS:
body.home .featured-image.page-header-image.grid-container.grid-parent {
max-width: 100%;
}
body.home .featured-image.page-header-image.grid-container.grid-parent img {
width: 100% !important;
height: auto;
object-fit: cover;
}
Edited: Apologies, I thought it worked. On desktop it is sorted but the featured image is not responsive on mobile
Edited: Apologies, I thought it worked. On desktop it is sorted but the featured image is not responsive on mobile
Can you provide a mockup image of how you want it to be laid out on mobile? So we can write the appropriate @media rule for it. :D