Image blocks within row blocks do not have custom sizings supported on published page

[dpasque]

Description

If you add an image block into a row block, and then set custom sizings for that image block (whether by dragging to resize, or setting a % in the block settings sidebar), that custom sizing won't be supported on the published page view.

Step-by-step reproduction instructions

1. Open a new post or page
2. Add a row block
3. Add an image block as the first block. Resize the image to a custom size.
4. Add a paragraph block as the second block. Make sure it's pretty long -- long enough to affect the flex sizing calculations.
5. Publish and view the post.

Screenshots, screen recording, code snippet

For example, here is an image in the editor:

... and that same row/image on the published page:

From what I can tell, this seems to maybe be an artifact of the differences in how we apply that sizing combining with the flex display here.

In the editor, we wrap the img in a div with some styling set directly in the style attribute, including some additional flex handling. In the published page, there is no such wrapping div, and the size is just translated to width and height attributes directly on the img.

Environment info

Theme was Twenty Twenty-Three, but it reproduces on multiple.

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes