Page MenuHomePhabricator

Actions menu <button> rendering issue in Firefox
Closed, ResolvedPublic

Assigned To
Authored By
piotrjurkiewicz
Nov 25 2014, 11:48 PM
Referenced Files
F238737: before.png
Nov 25 2014, 11:48 PM
F238739: after.png
Nov 25 2014, 11:48 PM

Description

Firefox renders buttons and links in action list inconsistently. There is a 2px extra spacing around button element. You can see that on this screenshot:

before.png (597×964 px, 43 KB)

"Subscribe" label is not in line with other labels. It happens, because "Subscirbe" is a <button>, whereas other menu elements are <a>.

This problem with Firefox is well known. Check this for example: http://stackoverflow.com/questions/5517744/remove-extra-button-spacing-padding-in-firefox

Adding this CSS rule solves the problem:

button::-moz-focus-inner {
    padding: 0;
    border: 0
}

Screenshot after:

after.png (547×875 px, 43 KB)

Revisions and Commits

Restricted Differential Revision

Event Timeline

piotrjurkiewicz raised the priority of this task from to Needs Triage.
piotrjurkiewicz updated the task description. (Show Details)
piotrjurkiewicz added a subscriber: piotrjurkiewicz.
chad triaged this task as Normal priority.
chad added a project: PHUI.
chad added a revision: Restricted Differential Revision.Nov 26 2014, 12:08 AM
chad added a commit: Restricted Diffusion Commit.

Closed by commit rPfa77fdd168d4.