WordPress.org

Make WordPress Core

Opened 4 months ago

Last modified 4 months ago

#54126 new defect (bug)

Twenty Twenty: Left and right image alignment issue in front side

Reported by: aezazshekh Owned by:
Milestone: Awaiting Review Priority: normal
Severity: normal Version:
Component: Bundled Theme Keywords: has-patch needs-screenshots
Focuses: css Cc:

Description

In the twentytwenty theme, when we give alignment left and right to the image from the backend, the design is breaking due to some properties on that image in the front side.

Attachments (4)

54126.diff (730 bytes) - added by aezazshekh 4 months ago.
Create a Patch
left-alignment.png (66.8 KB) - added by aezazshekh 4 months ago.
Screenshot of image left alignment
right-alignment.png (60.3 KB) - added by aezazshekh 4 months ago.
Screenshot of image right alignment ( image position distortion )
left_right_image.jpg (69.7 KB) - added by aezazshekh 4 months ago.
This left & right alignment issue was solved by modifying a few css properties. The issue is solved, its screenshot is attached.

Download all attachments as: .zip

Change History (8)

@aezazshekh
4 months ago

Create a Patch

#1 @aezazshekh
4 months ago

  • Keywords has-patch added

#2 @SergeyBiryukov
4 months ago

  • Component changed from Themes to Bundled Theme
  • Summary changed from Left and right image alignment issue in front side in twentytwenty theme to Twenty Twenty: Left and right image alignment issue in front side

#3 @SergeyBiryukov
4 months ago

  • Keywords needs-screenshots added

Hi there, welcome to WordPress Trac! Thanks for the report.

Could you share some screenshots of the issue?

It looks like the lines being patched here were added in [46711].

@aezazshekh
4 months ago

Screenshot of image left alignment

@aezazshekh
4 months ago

Screenshot of image right alignment ( image position distortion )

#4 @sabernhardt
4 months ago

Looking at PR 994, the absolute positioning seems to be an intentional design choice since the beginning of the theme.

The current styling is not appropriate for all images, but anyone who has aligned an image block with Twenty Twenty likely wants to keep it positioned that way.

You might appreciate the layout by placing the image inside a group block.

@aezazshekh
4 months ago

This left & right alignment issue was solved by modifying a few css properties. The issue is solved, its screenshot is attached.

Note: See TracTickets for help on using tickets.