Closed Bug 1287681 Opened 3 years ago Closed Last year

Spinner Buttons ridiculously small in Windows 10 (just 2px I think) (<input type=number>)

Categories

(Core :: Layout, defect, P3)

47 Branch
Unspecified
Windows 10
defect

Tracking

()

RESOLVED DUPLICATE of bug 1158435

People

(Reporter: jake_hotson, Unassigned)

Details

Attachments

(1 file)

Attached image ff-spinner-bug.png
User Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:47.0) Gecko/20100101 Firefox/47.0
Build ID: 20160623154057

Steps to reproduce:

View a web page with a spinner control just after upgrading from Windows 7 to Windows 10.

A cut-down test case is at http://www.qzdesign.co.uk/tests/spinner-test.php and consists of the following HTML, in which the <style> section is not necessary to reproduce but exaggerates the problem:

`
<!DOCTYPE html>
<html>
  <head>
    <title>Spinner Test</title>
    <style type="text/css">
      input {
        font-size: 4em;
        width: 2em;
      }
    </style>
  </head>
  <body>
    <form>
      <input
        step="1"
        min=""
        max=""
        name="quantity"
        value="1"
        title="Qty"
        size="4"
        pattern="[0-9]*"
        inputmode="numeric"
        type="number"
      />
    </form>
  </body>
</html>
`

I have not experimented with any of the input elements attributes to see if they make a difference.

I have also not yet rebooted since upgrading to Windows 10, maybe that will make a difference.

I am surprised that I could not find reference to a similar reported issue with a few searches.  It would be good to know if others do or don't see the problem on Windows 10 after an upgrade from Windows 7.


Actual results:

The spinner buttons are displayed 2px high each, mostly grey with sporadic black dots.  See attached screenshot.

Note that the problem did not occur on Windows 7 before upgrading to Windows 10.


Expected results:

The spinner buttons should be displayed proportionately-sized with the <input> container, and be easily clickable/tappable.
Status: UNCONFIRMED → NEW
Component: Untriaged → DOM
Ever confirmed: true
OS: Unspecified → Windows 10
Product: Firefox → Core
Also on linux the arrow buttons are rather small.
Summary: Spinner Buttons ridiculously small in Windows 10 (just 2px I think) → Spinner Buttons ridiculously small in Windows 10 (just 2px I think) (<input type=number>)
More info:

This occurs on a user account that was previously set to 'Windows Classic' (Personalization) before upgrading from Windows 7 to Windows 10.

It does not occur on other user accounts on the same system, that had not customized their 'Display'.

However, I think the fix is to NOT use OS-supplied controls for any `input`, as they cannot be relied upon, and it will make it easier for website developers to customize their appearance if there is not an OS dependency as well as a browser dependency.
That said, date & time picker much better in native OS than Google Chrome's terrible effort...
Priority: -- → P3
This is true again for the Firefox 60 version. The spinner buttons have only 2px height.
FYI: this was fixed in releases before, e.g. firefox 52.8.0 ESR works fine.
Trackback to bug 947365 and bug 1158435.  Might be Windows-specific, or specific to high-DPI.
Duplicate of bug 1158435.
Status: NEW → RESOLVED
Closed: Last year
Resolution: --- → DUPLICATE
Duplicate of bug: 1158435
You need to log in before you can comment on or make changes to this bug.