The pixel width is not applied correctly on the frontend. Although it is assigned to the element, it appears to be applied relatively, which may be causing the observed behavior.

Here’s a video showing the issue:
Video Demonstration

The pixel width is not applied correctly on the frontend. Although it is assigned to the element, it appears to be applied relatively, which may be causing the observed behavior.

Here’s a video showing the issue: Video Demonstration

I think its related to image block itself, as if you add an image with width 1020px, it should overflow on mobile but it doesn't.

Tried with: WP 6.6.2 & 2024 theme

Seems to be due to max-width being applied to image, I think we should have a toggle for this?

It seems that in the editor, the width is set to the <div> that holds the image then in the published page, the width is applied to the <img> itself

Screenshot of div with a width value on the editor

Perhaps on the front end the Image Width could be applied to the <figure> element and also give it a flex-shrink:0 to prevent this size from changing?

Screenshot where size and flex-shrink values have been added to figure element on front end to prevent the image from shrinking

@andreawetzel Based on my research into previous issues, adding width and height attributes in figure element appears to have been an intentional change related to captions. It might be worth exploring this further to identify a potential fix using max-width application.

Reference: PR #53274

I can reproduce, and both removing the max-width: 100% and a wrapper div work. I don't think we should add the div on the front-end though. Not sure what the right solution is here.