Layout Issues in WP 7

Since updating to WordPress 7.0, the media library toolbar filters render in a broken/stacked layout instead of a single tidy row — “Filter by type” and “Filter by date” are misaligned, and “Search media” and “Reset All Filters” get pushed onto separate rows below rather than sitting inline. (Screenshots attached.)

Root cause: WordPress core changed .media-toolbar-secondary from a float/inline-block layout to a fixed CSS Grid in wp-includes/css/media-views.css:

.media-toolbar-secondary {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-column-gap: 12px;
    grid-row-gap: 0px;
    align-items: end;
}
label[for="media-attachment-filters"]      { grid-area: 1 / 1 / 2 / 2; }
select#media-attachment-filters            { grid-area: 2 / 1 / 3 / 2; }
label[for="media-attachment-date-filters"] { grid-area: 1 / 2 / 2 / 3; }
select#media-attachment-date-filters       { grid-area: 2 / 2 / 3 / 3; }

This grid only defines explicit grid-area placement for the two default core filters. EML’s AttachmentsBrowser.createToolbar override (in eml-media-views.min.js) adds several more elements into the same .media-toolbar-secondary container — the search label/input, the “Reset All Filters” button, and (when enabled) author/taxonomy filter dropdowns. None of those have a matching grid-area, so they fall into CSS Grid’s implicit auto-placement and get shoved onto extra rows outside the intended 2×2 layout, producing the stacked/misaligned appearance.

EML’s existing CSS in eml-admin-media.css (the rules under /* == Media Popup Positions == */, e.g. select.attachment-filters { max-width: calc(48% - 12px); ... }) was written for the old float-based toolbar and doesn’t account for this new grid.

Suggested fix: Override .media-toolbar-secondary in EML’s own CSS to either:

1. Replace display: grid with a flex-wrap layout (display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px;) when EML’s extra elements are present, or
2. Extend the grid template (e.g. grid-template-columns: repeat(auto-fill, minmax(150px, 1fr))) and add grid-area/order rules for EML’s injected label/select/button elements so they land in predictable cells alongside core’s two.

Happy to test a patch if one’s available. Note: functionally the filters/search/reset still work when clicked — this is purely a layout regression, not broken behavior.