Make WordPress Core

Opened 13 months ago

Closed 12 months ago

Last modified 2 months ago

#62537 closed defect (bug) (reported-upstream)

The command search field at top of post editor does not anymore self-adjust to width of browser window

Reported by: joergwiesner's profile joergwiesner Owned by:
Milestone: Priority: normal
Severity: normal Version: 6.7
Component: Editor Keywords:
Focuses: ui, accessibility Cc:

Description

The command search field (inside text: "CTRL + K" ) on top line in post editor since WP 6.7, also in 6.7.1, does not anymore self-adjust to the width of the browser window. In consequence when narrpwing the browser window it soon overlaps the "Save" button on its right, thus makingthe "Save" button unaccessible.

Attachments (2)

WP6.6-self-adjusting-command-search-field.jpg (20.0 KB) - added by joergwiesner 13 months ago.
WP6.7-6.7.1-NOT-anymore-self-adjusting-command-search-field.jpg (14.7 KB) - added by joergwiesner 13 months ago.

Download all attachments as: .zip

Change History (7)

#1 @yogeshbhutkar
13 months ago

Hi @joergwiesner,

Thank you for raising the ticket.

I attempted to reproduce the behavior and observed that the command search field's width is responsive, adjusting appropriately based on the browser's viewport. Additionally, I did not encounter any overlapping issues with the save button during testing.

Here are the details of my testing environment:

WordPress Version: 6.7.1
Tested on WordPress Trunk branch: Version 6.8-alpha-59274-src

Could you confirm if the behavior persists when external themes and plugins are disabled? This would help isolate the issue further.

#2 @abcd95
13 months ago

Hey @joergwiesner, Thanks for bringing this up.

The layout issue you're experiencing appears to be related to the interaction between custom plugin icons and the command search field.

I was able to reproduce this after installing multiple plugins that created custom icons in my post editor and the "Save" button was misplaced on the small screen.

Plugins Installed - Elementor 3.25.4, Yoast SEO
Testing with screen width - 477px

Screenshot - https://postimg.cc/62tKhj5Y

However, It is to be noted that this layout issue only occurs when there are multiple plugin icons interfering.

This ticket was mentioned in Slack in #accessibility by joedolson. View the logs.


12 months ago

#4 follow-up: @sabernhardt
12 months ago

  • Keywords needs-patch removed
  • Milestone Awaiting Review deleted
  • Resolution set to reported-upstream
  • Status changed from new to closed

This is the same basic issue as https://github.com/WordPress/gutenberg/issues/67069

It already has a merged change. If you could test whether that meets your needs, possibly using next week's plugin version 19.9, that would help.

I'll close this ticket, but please feel free to continue the discussion on the Gutenberg issue.

Version 0, edited 12 months ago by sabernhardt (next)

#5 in reply to: ↑ 4 @johnkelvin1
2 months ago

Replying to sabernhardt:

This is the same basic issue as Github issue No.6709

It already has a merged change. If you could test whether that meets your needs, possibly using version 19.9 of the Gutenberg plugin when that is available, that would help.

I'll close this ticket, but please feel free to continue the discussion on the Gutenberg issue.

Thank you so much for the update! That’s great to hear a fix has already been merged. Really appreciate all the work that’s gone into this. I’ll follow the GitHub issue for any further updates.

Note: See TracTickets for help on using tickets.