`Dismiss Errors` button alignment is not centered in Media Library.

[iamjaydip]

When I drag/upload an SVG image in the Media library then it shows a mime types error and the "Dismiss Errors" button is not aligned properly.

[iamjaydip]

Please find the attachment to good understand the issue.

[vishitshah]

.errors.media-uploader-status .upload-dismiss-errors, .errors.media-uploader-status .upload-errors {
display: inline-block;
}

[poojapadamad]

Test Report

Description

This report validates whether the indicated patch works as expected.

Patch tested: https://core.trac.wordpress.org/attachment/ticket/55492/55492.diff

Environment

• WordPress: 6.9-alpha-60093-src
• PHP: 8.2.29
• Server: nginx/1.29.0
• Database: mysqli (Server: 8.4.6 / Client: mysqlnd 8.2.29)
• Browser: Chrome 138.0.0.0
• OS: macOS
• Theme: Twenty Twenty 2.9
• MU Plugins: None activated
• Plugins:
  • Test Reports 1.2.0

Actual Results

1.  ✅Dismiss errors button is aligned in center.

Supplemental Artifacts

Attachment -https://core.trac.wordpress.org/attachment/ticket/55492/New%20Note.jpeg

[sabernhardt]

sets margin: 0 auto to the dismiss button only when it is inside the media frame (adding media to a post)

[sabernhardt]

New Note.jpeg​ shows that 55492.diff centers the dismiss button on the Media Library page, in Grid mode, where it should not be centered.

Setting display: inline-block on .errors.media-uploader-status .upload-dismiss-errors might be fine, but .errors.media-uploader-status .upload-errors should remain block.

For a simpler change, 55492.1.diff​ centers only the dismiss button, only in the .media-frame.

[r1k0]

Patch Testing Report

Patch Tested: https://core.trac.wordpress.org/attachment/ticket/55492/55492.1.diff

Environment

• WordPress: 7.0-alpha-61215-src
• PHP: 8.2.29
• Server: nginx/1.29.4
• Database: mysqli (Server: 8.4.7 / Client: mysqlnd 8.2.29)
• Browser: Chrome 144.0.0.0
• OS: Linux
• Theme: Twenty Twenty-Five 1.4
• MU Plugins: None activated
• Plugins:
  • Test Reports 1.2.1

Steps taken

1. On admin dashboard go to Posts > Add Post.
2. Click the Set Featured Image button on the setting tab on the right.
3. Ensure you are in Upload files section, and upload/drop an SVG file.
4. Observe the position of the Dismiss Errors button.
5. ✅ Patch is solving the problem.

Expected result

• The dismiss button is centered in .media-frame.

Additional Notes

• None

Screenshots/Screencast with results

• Screenshot before:

• Screenshot after: