Make WordPress Core

Opened 4 weeks ago

Last modified 3 weeks ago

#66092 new defect (bug)

Add 8px gap between Media Library search field and button on mobile/tablet

Reported by: deeppatel8950 Owned by:
Priority: normal Milestone: Awaiting Review
Component: Media Version: 7.1
Severity: normal Keywords: has-patch
Cc: Focuses: ui, css

Description

The Media Library search form does not maintain consistent spacing between the search input field and the Search Media button on certain mobile and tablet screen sizes.

On desktop, the search field and button are displayed correctly with appropriate spacing. However, at smaller responsive breakpoints, the spacing between these elements is missing.

Expected Behavior:
An 8px horizontal gap should be maintained between the search input field and the Search Media button on mobile and tablet screen sizes.

Required Change:
The current column-gap between the Media Library search input and the Search Media button is 0. Please update the column-gap from 0 to 8px at the applicable mobile/tablet breakpoint.

Attachments (5)

Screenshot 2026-09-11 at 12.16.32 PM.png​ (1.2 MB ) - added by deeppatel8950 4 weeks ago.
Screenshot 2026-09-11 at 12.16.32 PM.2.png​ (1.2 MB ) - added by deeppatel8950 4 weeks ago.
Screenshot 2026-09-11 at 12.19.31 PM.png​ (596.7 KB ) - added by deeppatel8950 4 weeks ago.
Screenshot 2026-09-11 at 11.28.57 AM.png​ (1.1 MB ) - added by deeppatel8950 4 weeks ago.
66092.diff​ (359 bytes ) - added by vishalkanjariya21 4 weeks ago.
Added an 8px column gap between the Media Library search input and Search Media button at the affected responsive breakpoint. Tested the spacing on mobile and tablet viewport sizes

Change History (6)

@vishalkanjariya21
4 weeks ago

Added an 8px column gap between the Media Library search input and Search Media button at the affected responsive breakpoint. Tested the spacing on mobile and tablet viewport sizes

This ticket was mentioned in ​PR #13518 on ​WordPress/wordpress-develop by ​@rockscoder.


3 weeks ago
#1

  • Keywords has-patch added

### Description
On mobile and tablet viewports (<= 1000px), \.wp-filter p.search-box\ in \src/wp-admin/css/media.css\ set \column-gap: 0;\, which removed the default 8px (\

Note: See TracTickets for help on using tickets.