[wp-trac] [WordPress Trac] #49820: Input and select elements are misaligned in the admin area

[WordPress Trac]

#49820: Input and select elements are misaligned in the admin area
----------------------------+--------------------------------------
 Reporter:  luigipulcini    |       Owner:  (none)
     Type:  defect (bug)    |      Status:  new
 Priority:  normal          |   Milestone:  Awaiting Review
Component:  Administration  |     Version:  5.4
 Severity:  trivial         |  Resolution:
 Keywords:  needs-patch     |     Focuses:  ui, css, administration
----------------------------+--------------------------------------

Comment (by luigipulcini):

 Thanks for your feedback.

 I noticed that you tested it for inputs that are children of the `tablenav
 top` class, which doesn't show any misalignment even in my case.

 My test was in a different environment, though, since I was interested in
 placing a text box side by side with a select box in a page of the
 Settings.

 This is what I did in order to make a quick test:
 1 – go to "Settings > General"
 2 – inspect the page in the Developer Tools
 3 – from the `td` node referring to the "Site Title" option, select and
 copy the textbox node
 4 – inspect the row referring to the "New User Default Role" option, which
 is the first select box on the page
 5 – select the `td` node and paste the input box copied on step 3 as a
 child of the `td` node

 I have just repeated the same process in:
 – Chrome 80.0.3987.163 (Windows 10)
 – Firefox 75.0 (Windows 10)
 – Edge 44.18362.449.0 (Windows 10)
 – Safari 11.1.2 (OSX 10.11.6)

 getting the exact same result across all the browsers.
 Furthermore, assigning the `vertical-align: middle` to the input box fixes
 the misalignment in every browser I tested.

 Some further notes:
 – for every browser, I made sure the cache was fresh;
 – the test was run on a WordPress installation with zero plugins installed
 and a custom theme that I have just started building, so it has no styling
 whatsoever, especially for the backend.

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/49820#comment:2>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform