Make WordPress Core

Opened 8 years ago

Closed 8 years ago

Last modified 8 years ago

#26151 closed defect (bug) (fixed)

Media buttons separate tabs from post editor in the new post page on small screens

Reported by: melchoyce Owned by: azaozz
Milestone: 3.8 Priority: normal
Severity: normal Version: 3.8
Component: Administration Keywords: has-patch
Focuses: ui Cc:


When the editor hits the small screen size, the media and attachment buttons can force the html/visual tabs away from the post editor:

I tried to fix it myself but ran into some issues. The buttons and tabs, unfortunately, are listed in the same div. This makes styling them separately very difficult and hacky, relying on floating and/or absolutely positioning. I think the best solution would be to separate the buttons and tabs out into two separate containers, so we can give the button container a 100% max-width on smaller screens, but the php for that is beyond my skill level.

You can find the php in question in /wp-includes/class-wp-editor.php, line 128-143.

Attachments (1)

26151.diff (1.2 KB) - added by ryelle 8 years ago.

Download all attachments as: .zip

Change History (5)

8 years ago

#1 @ryelle
8 years ago

26151.diff moves the tabs HTML ($buttons) to below the media buttons, wraps the tabs in a div (to prevent them from stacking), and floats the buttons/tabs so they stay on the same line. When they need to wrap, the tabs stay on one line, with the media button(s) above them.

#2 @melchoyce
8 years ago

  • Keywords has-patch added

#3 @azaozz
8 years ago

  • Owner set to azaozz
  • Resolution set to fixed
  • Status changed from new to closed

In 26315:

Fix the editor switching tabs position on small screens, props ryelle, fixes #26151.

#4 @azaozz
8 years ago

  • Milestone changed from Awaiting Review to 3.8
Note: See TracTickets for help on using tickets.