Make WordPress Core

Opened 4 years ago

Closed 3 weeks ago

#56038 closed defect (bug) (worksforme)

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

Reported by: mrfoxtalbot's profile mrfoxtalbot Owned by:
Milestone: Priority: normal
Severity: normal Version:
Component: Bundled Theme Keywords: dev-feedback
Focuses: css Cc:

Description

  1. Add two blocks: One paragraph and one image.
  2. Place the image on top and align it to one side.
  3. Try to scale the image up to use 75% or more of the available width.

This seems to possible in the editor but when visiting the public site, the image will never use up more than 50% of the available space.

There is as similar issue affecting Twenty Twenty: https://core.trac.wordpress.org/ticket/55581#ticket

Attachments (1)

Screen Capture on 2022-06-22 at 13-08-25.mp4 (3.1 MB) - added by mrfoxtalbot 4 years ago.
Scaling floated image blocks does not work as expected

Change History (7)

@mrfoxtalbot
4 years ago

Scaling floated image blocks does not work as expected

#1 @joyously
4 years ago

The style has a max-width related to the viewport, which makes sense for a floated image, so the text has room to wrap around.

#2 @sagarladani
4 years ago

Hello @mrfoxtalbot,

According to the standard, we cannot change the size in this way. In case you have changed the size, you can do it manually by selecting the height and width options on the right side.

You can also add a class and use this class to add style to your images. For example add your class in image and you have add your class name is "abcd". Please find below CSS and apply to your project.

.entry-content > .wp-block-image.abcd figure {
    max-width: inherit;
}

Hoping that your issue has been resolved, try this one if you still have questions, let me know.

Thanks

#3 @mrfoxtalbot
4 years ago

Thank you for your replies @sagarladani & @joyously

It feels a bit too opinionated but I understand and see merit in the idea of limiting the max-width of an image to allow text wrapping around.

My beef here is that, if the changes are not going to be reflected in the public site, it should NOT be possible to make the image bigger than 50% in the editor itself, as this can lead to confusion and frustration.

#4 @desrosj
4 years ago

  • Version trunk deleted

#5 @karmatosed
2 years ago

  • Keywords dev-feedback added

#6 @sabernhardt
3 weeks ago

  • Milestone Awaiting Review deleted
  • Resolution set to worksforme
  • Status changed from new to closed

Twenty Twenty-One set the max-width to 50% on the front and 290 pixels in the editor. Before WordPress 6.7, the editor overrode the theme's limit.

I agree with limiting the width of floated images, and I would not want to change that after more than five years. Now the editor reflects a limit, too, so it is not a surprise when you see the front end.

I'm going to close the ticket because I think it is fixed well enough.

Note: See TracTickets for help on using tickets.