Buttons on Edit Media screen have smaller height than other buttons

[hbhalodia]

• On Edit media screen, we have some buttons which are used to update the media, may be crop, rotate etc, for which the buttons sizes are not consistent are less than other buttons across the admin site.
• Button such as, Crop, Scale, rotation have 28px height, while the button across site have 30px, which looks odd.
• When we try to add the crop, we see 2 buttons in line, Apply Crop and Clear Crop, which actually identifies this issue, as both buttons are not aligned and Clear crop button is actually a 2px small, which should not be.
• CSS which adds this is actually added here, ​https://github.com/WordPress/wordpress-develop/blob/eeb8fbf81bfc3fe83efd9bc327ac5015211b76b7/src/wp-admin/css/media.css#L974-L980, On changing to 30px, actually resolves the issue.

[hbhalodia]

Button with 28px height

[hbhalodia]

Button with 30px height

Trac ticket: https://core.trac.wordpress.org/ticket/63559

• After Fix:

[sabernhardt]

[46326] resized the image editing buttons to show text with the icons, but then [46866] apparently missed standardizing their height.

Hi @sabernhardt, I have updated the PR to use the 28px line height.

[sandeepdahiya]

Bug Reproduction and Test Report

✅ This report validates that the indicated patch addresses the issue.
Patch tested: ​Patch-8963.diff

Environment

• OS: Windows 11 Home
• Web Server: Nginx 1.27.5
• PHP: 8.2.28
• WordPress: 6.9-alpha-60093-src
• Browser: Mozilla Firefox 139.0.1 (Latest)
• Theme: Twenty Fourteen
• Active Plugins:
  • Code Snippets 3.6.8
  • WordPress Beta Tester 3.6.3

Actual Results

• 🐞 Bug reproduction - On the Media → Edit Image screen, several buttons had inconsistent heights. The "Apply Crop" button was 30px, while other action buttons — "Clear Crop", "Crop", "Scale", and "Rotate" — were only 28px high, resulting in visual misalignment.

​Clear crop button 28px
​Crop, Scale, Image Rotation - Button 28px
​Apply crop button 30px

• ✅ Issue resolved with patch – It standardizes all related buttons to 30px height, resolving the inconsistency.

​Apply Crop, Clear Crop button - 30px
​Crop, Scale, Image Rotation - Button 30px

Additional Notes

• The above patch works smoothly on smaller screen sizes as well.

[mikinc860]

The solution appears to be working, but it's also affecting other buttons on the same screen. Please ensure that everything remains properly aligned.

[hbhalodia]

Hi @mikinc860, Can you please share how it's affecting other buttons, or what other buttons are being affected? It would help in updating the solution.

Thank You,

The changes looks good to me.

[mukesh27]

Mark ready for commit.