Review the usage of the `::-moz-focus-inner` CSS fix for the buttons extra padding in Firefox

[afercia]

For a number of years, Firefox used to set some extra padding on the buttons (or inputs of type button/submit/reset). To address this, WordPress uses a known fix targeting the proprietary Firefox pseudo element ::-moz-focus-inner.

Seems something has changed recently and starting with Firefox 53, FF doesn't apply the extra padding any longer. I think the relevant Bugzilla ticket Firefox 53 release notes, though.

Testing a bit on Windows, in the screenshot below:

• on the left, Firefox 48: buttons without and with the CSS fix: there's a clear size difference
• on the right: Firefox 54: buttons without and with the CSS fix: no size difference

Codepen available here: ​https://codepen.io/afercia/full/Gvrzwz/

Seems these rules used across the admin stylesheets could be simplified a bit. The only part that needs to stay is border-width: 0; or, maybe better, border: 0; which is necessary on Windows to remove the dotted line on :focus:

This could be also a good opportunity for some clean-up. For example, seems to me in press-this.css there are two identical rules.

[ViktorFroberg]

Remove duplicate css rule in press-this.css, remove padding: 0, change border-style: none and border-width: 0 to border: 0 in all ::-moz-focus-inner rules.

[DrewAPicture]

Assigning to mark the good-first-bug as "claimed".

@afercia Could you please review the patch? :-)

[afercia]

The patch should be refreshed as Press This is now a plugin and not part of core any longer. Also, files from external libraries such as jquery-ui-dialog.css shouldn't be modified.

[ViktorFroberg]

Refreshed. Don't modify external libraries.

[ViktorFroberg]

Hi @afercia, sorry for the delay.
Here is a refresh of the patch.

#WCEU