WordPress.org

Make WordPress Core

Opened 5 years ago

Closed 4 years ago

#31826 closed defect (bug) (fixed)

Manager menus

Reported by: Luan Ramos Owned by: afercia
Milestone: 4.5 Priority: normal
Severity: normal Version: 4.1.1
Component: Menus Keywords: has-patch has-screenshots
Focuses: ui, administration Cc:
PR Number:

Description (last modified by SergeyBiryukov)

.menu-location-menus select {
    float: left;
    max-width: 100%;
}

Attachments (3)

menu-edit.png (22.8 KB) - added by Luan Ramos 5 years ago.
When we click on the tab menu manager position and give a resize the screen to select is not fluid
31826.patch (319 bytes) - added by sagarjadhav 5 years ago.
Fixed Issue
31826.2.patch (1.5 KB) - added by afercia 4 years ago.

Download all attachments as: .zip

Change History (9)

@Luan Ramos
5 years ago

When we click on the tab menu manager position and give a resize the screen to select is not fluid

#1 in reply to: ↑ description @Luan Ramos
5 years ago

Replying to Luan Ramos:

.menu-location-menus select {
    max-width: 100%; // new
}
Last edited 5 years ago by SergeyBiryukov (previous) (diff)

#2 @SergeyBiryukov
5 years ago

  • Component changed from General to Menus
  • Description modified (diff)
  • Focuses accessibility template removed

@sagarjadhav
5 years ago

Fixed Issue

#3 @sagarjadhav
5 years ago

  • Keywords has-patch added

@afercia
4 years ago

#4 @afercia
4 years ago

  • Keywords has-screenshots added
  • Milestone changed from Awaiting Review to 4.5
  • Owner set to afercia
  • Status changed from new to assigned

To recap, this issue is very clear when a menu has a very long name. In the responsive view, the "select-menu-to-edit" and "menu-locations" selects become too large to fit the screen, see screenshot below:

https://cldup.com/TrKiHeriVE.png

There are also some vertical alignment issues. I'd propose to simplify, use inline-block instead of floats and let browsers do their job to vertically align things. Also set a max-width on the selects as suggested in the previous patches. Screenshot with the last patch applied:

https://cldup.com/hXyI81grJ2.png

A slightly better vertical alignment in the "desktop" view:

https://cldup.com/AjwYWR63xl.png

This ticket was mentioned in Slack in #core by afercia. View the logs.


4 years ago

#6 @afercia
4 years ago

  • Resolution set to fixed
  • Status changed from assigned to closed

In 36264:

Menus screen: improve responsiveness of select elements.

Props Luan-Ramos, sagarjadhav.
Fixes #31826.

Note: See TracTickets for help on using tickets.