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)

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.