Featured image in a post not responsive / doesn’t resize on mobile

ls there any way I can get a featured image in my posts to scale down on mobile? They seem to be staying full size.?

Hi @craigkellymusic there is a bug that is causing featured images to overlap on smaller screens. It was reported on the GitHub issue below:

https://github.com/WordPress/gutenberg/issues/48988

In the meantime, you can try to use the CSS code below

@media only screen and (max-width: 954px) {
 body .is-layout-constrained > .alignwide {
    max-width: fit-content;
}
}

Thanks @thelmachido – while that works for the width it unfortunately squishes the image (ie doesn’t affect the height).

Thanks?@thelmachido?– while that works for the width it unfortunately squishes the image (ie doesn’t affect the height).

Hi @craigkellymusic mmm I see, does the issue persist when the Gutenberg is disabled? I would suggest deactivating the plugin because at times that resolves the issue.

Here’s the fix:

@media only screen and (max-width: 600px) {
figure.alignwide.wp-block-post-featured-image {
width: 100% !important;
}
}

Any updates on this issue? Twenty-Twenty-Two works fine for me but Twenty-Three doesn’t reduce featured image size, even w/ the suggested code. And I can’t disable Gutenberg bc I need it for posts.

Hey @s4s – it looks like there’s no movement on the Github issue where work is being handled – but I’ve just given it a nudge.

https://github.com/WordPress/gutenberg/issues/48988