Twenty Twenty: Aligned images cannot be resized or are properly displayed

[robertghetau]

Steps to replicate:

1. Create a new page
2. Add content to it and make sure you have a paragraph block and an image block.
3. Align the block to the right and modify its size.

Two things will happen:

1. The size of the image is not respected.
2. The alignment is not the same(editor vs frontend)

This happens with the latest version of WordPress(5.9.3) and Twenty Twenty(1.9)

[hilayt24]

Hi @robertghetau,

I can reproduce this issue. And by looking deeper I found that the position absolute is the p[roblem. By removing that the images will be visible the same in front and back.

But somehow I can't able to reproduce the first issue.

[hilayt24]

Remove the position absolute from the below class.

@media (min-width: 1000px)
.entry-content > .alignleft, .entry-content > p .alignleft, .entry-content > .wp-block-image .alignleft {
    position: absolute;
}

[mrfoxtalbot]

I am still able to reproduce this.

To clarify, making the floated image small does work but there seems to be a limit on how big the image can be made. I'm going to add a link to a screenshot for clarity:

​https://mrfoxtestingsite.files.wordpress.com/2022/06/screen-capture-on-2022-06-22-at-12-52-41.mp4

[mrfoxtalbot]

I have opened a matching issue to track this bug for Twenty Twenty-One: https://core.trac.wordpress.org/ticket/56038