--- a/accessible/tests/mochitest/name/test_general.xul
+++ b/accessible/tests/mochitest/name/test_general.xul
@@ -48,30 +48,30 @@
       testName("rememberAfter", "days");
 
       // Anonymous content (see name.xbl#third)
       var anonBtn = getAccessible("labelledby_box_anon").lastChild;
       testName(anonBtn, "It's a cool button");
 
       //////////////////////////////////////////////////////////////////////////
       // Name from subtree (single relation labelled_by).
-      
+
       // Gets the name from text nodes contained by nested elements.
       testName("btn_labelledby_mixed", "nomore text");
 
       // Gets the name from text nodes and selected item of menulist
       // (other items are ignored).
       testName("btn_labelledby_mixed_menulist",
                "nomore text selected item more text");
-      
+
       // Gets the name from text nodes contained by nested elements, ignores
       // hidden elements (bug 443081).
       testName("btn_labelledby_mixed_hidden_child", "nomore text2");
 
-      // Gets the name from hidden text nodes contained by nested elements, 
+      // Gets the name from hidden text nodes contained by nested elements,
       // (label element is hidden entirely), (bug 443081)
       testName("btn_labelledby_mixed_hidden", "lala more hidden text");
 
 
       //////////////////////////////////////////////////////////////////////////
       // Name for nsIDOMXULLabeledControlElement.
 
       // Gets the name from @label attribute.
@@ -229,17 +229,17 @@
 
   <!-- aria-labelledby, multiple relations -->
   <box class="third" id="labelledby_box_anon" role="group" />
 
   <!-- trick aria-labelledby -->
   <checkbox id="rememberHistoryDays"
             label="Remember "
             aria-labelledby="rememberHistoryDays historyDays rememberAfter"/>
-  <textbox id="historyDays" type="number" size="3" value="3"
+  <textbox id="historyDays" type="number" value="3"
            aria-labelledby="rememberHistoryDays historyDays rememberAfter"/>
   <label id="rememberAfter">days</label>
 
   <!-- the name from subtree, mixed content -->
   <description id="labelledby_mixed">
     no<description>more text</description>
   </description>
   <button id="btn_labelledby_mixed"
@@ -308,18 +308,18 @@
     <button id="btn_label_4"/>
   </hbox>
 
   <!-- label element, anonymous content -->
   <box id="box_label_anon1"
        class="first"
        role="group"/>
 
-  <box id="box_label_anon2" 
-       class="second" 
+  <box id="box_label_anon2"
+       class="second"
        role="group"/>
 
   <!-- tooltiptext -->
   <box id="box_tooltiptext"
        role="group"
        tooltiptext="tooltiptext label"/>
 
   <!-- the name from @title of toolbaritem -->
@@ -374,9 +374,8 @@
                   label="Send an E-mail"/>
       </menupopup>
     </menulist>
   </hbox>
 
   </vbox> <!-- close tests area -->
   </hbox> <!-- close main area -->
 </window>
-

--- a/browser/components/preferences/connection.xul
+++ b/browser/components/preferences/connection.xul
@@ -74,17 +74,17 @@
             <row align="center">
               <hbox pack="end">
                 <label accesskey="&http2.accesskey;" control="networkProxyHTTP">&http2.label;</label>
               </hbox>
               <hbox align="center">
                 <textbox id="networkProxyHTTP" flex="1"
                          preference="network.proxy.http" onsyncfrompreference="return gConnectionsDialog.readHTTPProxyServer();"/>
                 <label accesskey="&HTTPport.accesskey;" control="networkProxyHTTP_Port">&port2.label;</label>
-                <textbox id="networkProxyHTTP_Port" type="number" max="65535" size="5"
+                <textbox id="networkProxyHTTP_Port" class="proxy-port-input" type="number" max="65535" hidespinbuttons="true"
                          preference="network.proxy.http_port" onsyncfrompreference="return gConnectionsDialog.readHTTPProxyPort();"/>
               </hbox>
             </row>
             <row>
               <hbox/>
               <hbox>
                 <checkbox id="shareAllProxies" label="&shareproxy.label;" accesskey="&shareproxy.accesskey;"
                           preference="network.proxy.share_proxy_settings"
@@ -94,42 +94,42 @@
             <row align="center">
               <hbox pack="end">
                 <label accesskey="&ssl2.accesskey;" control="networkProxySSL">&ssl2.label;</label>
               </hbox>
               <hbox align="center">
                 <textbox id="networkProxySSL" flex="1" preference="network.proxy.ssl"
                          onsyncfrompreference="return gConnectionsDialog.readProxyProtocolPref('ssl', false);"/>
                 <label accesskey="&SSLport.accesskey;" control="networkProxySSL_Port">&port2.label;</label>
-                <textbox id="networkProxySSL_Port" type="number" max="65535" size="5" preference="network.proxy.ssl_port"
-                         onsyncfrompreference="return gConnectionsDialog.readProxyProtocolPref('ssl', true);"/>
+                <textbox id="networkProxySSL_Port" class="proxy-port-input" type="number" max="65535" size="5" preference="network.proxy.ssl_port"
+                         hidespinbuttons="true" onsyncfrompreference="return gConnectionsDialog.readProxyProtocolPref('ssl', true);"/>
               </hbox>
             </row>
             <row align="center">
               <hbox pack="end">
                 <label accesskey="&ftp2.accesskey;" control="networkProxyFTP">&ftp2.label;</label>
               </hbox>
               <hbox align="center">
                 <textbox id="networkProxyFTP" flex="1" preference="network.proxy.ftp"
                          onsyncfrompreference="return gConnectionsDialog.readProxyProtocolPref('ftp', false);"/>
                 <label accesskey="&FTPport.accesskey;" control="networkProxyFTP_Port">&port2.label;</label>
-                <textbox id="networkProxyFTP_Port" type="number" max="65535" size="5" preference="network.proxy.ftp_port"
-                         onsyncfrompreference="return gConnectionsDialog.readProxyProtocolPref('ftp', true);"/>
+                <textbox id="networkProxyFTP_Port" class="proxy-port-input" type="number" max="65535" size="5" preference="network.proxy.ftp_port"
+                         hidespinbuttons="true" onsyncfrompreference="return gConnectionsDialog.readProxyProtocolPref('ftp', true);"/>
               </hbox>
             </row>
             <row align="center">
               <hbox pack="end">
                 <label accesskey="&socks2.accesskey;" control="networkProxySOCKS">&socks2.label;</label>
               </hbox>
               <hbox align="center">
                 <textbox id="networkProxySOCKS" flex="1" preference="network.proxy.socks"
                          onsyncfrompreference="return gConnectionsDialog.readProxyProtocolPref('socks', false);"/>
                 <label accesskey="&SOCKSport.accesskey;" control="networkProxySOCKS_Port">&port2.label;</label>
-                <textbox id="networkProxySOCKS_Port" type="number" max="65535" size="5" preference="network.proxy.socks_port"
-                         onsyncfrompreference="return gConnectionsDialog.readProxyProtocolPref('socks', true);"/>
+                <textbox id="networkProxySOCKS_Port" class="proxy-port-input" type="number" max="65535" size="5" preference="network.proxy.socks_port"
+                         hidespinbuttons="true" onsyncfrompreference="return gConnectionsDialog.readProxyProtocolPref('socks', true);"/>
               </hbox>
             </row>
             <row>
               <spacer/>
               <box pack="start">
               <radiogroup id="networkProxySOCKSVersion" orient="horizontal"
                           preference="network.proxy.socks_version">
                 <radio id="networkProxySOCKSVersion4" value="4" label="&socks4.label;" accesskey="&socks4.accesskey;" />

--- a/browser/themes/shared/incontentprefs/preferences.inc.css
+++ b/browser/themes/shared/incontentprefs/preferences.inc.css
@@ -891,8 +891,14 @@ menulist[indicator=true] > menupopup men
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;
 }
 
 .no-results-message[query*=🔥🦊] > .no-results-container {
   visibility: hidden;
 }
+
+/* Proxy port input */
+
+.proxy-port-input {
+  width: calc(5ch + 22px); /* 5 chars + 11px padding on both sides */
+}

--- a/toolkit/components/printing/content/printPreviewBindings.xml
+++ b/toolkit/components/printing/content/printPreviewBindings.xml
@@ -30,17 +30,17 @@
       <xul:vbox align="center" pack="center">
         <xul:label value="&page.label;" accesskey="&page.accesskey;" control="pageNumber"/>
       </xul:vbox>
       <xul:toolbarbutton anonid="navigateHome" class="navigate-button tabbable"
         oncommand="parentNode.navigate(0, 0, 'home');" tooltiptext="&homearrow.tooltip;"/>
       <xul:toolbarbutton anonid="navigatePrevious" class="navigate-button tabbable"
         oncommand="parentNode.navigate(-1, 0, 0);" tooltiptext="&previousarrow.tooltip;"/>
       <xul:hbox align="center" pack="center">
-        <xul:textbox id="pageNumber" size="3" value="1" min="1" type="number"
+        <xul:textbox id="pageNumber" value="1" min="1" type="number"
           hidespinbuttons="true" onchange="navigate(0, this.valueNumber, 0);"/>
         <xul:label value="&of.label;"/>
         <xul:label value="1"/>
       </xul:hbox>
       <xul:toolbarbutton anonid="navigateNext" class="navigate-button tabbable"
         oncommand="parentNode.navigate(1, 0, 0);" tooltiptext="&nextarrow.tooltip;"/>
       <xul:toolbarbutton anonid="navigateEnd" class="navigate-button tabbable"
         oncommand="parentNode.navigate(0, 0, 'end');" tooltiptext="&endarrow.tooltip;"/>

--- a/toolkit/content/tests/chrome/test_textbox_number.xul
+++ b/toolkit/content/tests/chrome/test_textbox_number.xul
@@ -5,29 +5,29 @@
   XUL Widget Test for textbox type="number"
   -->
 <window title="Textbox type='number' test" width="500" height="600"
         xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
   <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
   <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"></script>
 
 <hbox>
-  <textbox id="n1" type="number" size="4"/>
+  <textbox id="n1" type="number"/>
   <textbox id="n2" type="number" value="10" min="5" max="15"/>
 </hbox>
 <hbox>
-  <textbox id="n4" type="number" size="4" value="-2" min="-8" max="18"/>
+  <textbox id="n4" type="number" value="-2" min="-8" max="18"/>
   <textbox id="n5" type="number" value="-17" min="-10" max="-3"/>
 </hbox>
 <hbox>
-  <textbox id="n6" type="number" size="4" value="9" min="12" max="8"/>
+  <textbox id="n6" type="number" value="9" min="12" max="8"/>
   <textbox id="n8" type="number" hidespinbuttons="true"/>
 </hbox>
 <hbox>
-  <textbox id="n9" type="number" size="4" oninput="updateInputEventCount();"/>
+  <textbox id="n9" type="number" oninput="updateInputEventCount();"/>
 </hbox>
 
   <!-- test results are displayed in the html:body -->
   <body xmlns="http://www.w3.org/1999/xhtml" style="height: 300px; overflow: auto;"/>
 
   <!-- test code goes here -->
   <script type="application/javascript"><![CDATA[
 SimpleTest.waitForExplicitFinish();

--- a/toolkit/themes/linux/global/jar.mn
+++ b/toolkit/themes/linux/global/jar.mn
@@ -14,17 +14,17 @@ toolkit.jar:
    skin/classic/global/findBar.css
 *  skin/classic/global/global.css
    skin/classic/global/groupbox.css
    skin/classic/global/listbox.css
    skin/classic/global/menu.css
    skin/classic/global/menulist.css
    skin/classic/global/netError.css
 *  skin/classic/global/notification.css
-   skin/classic/global/numberbox.css
+*  skin/classic/global/numberbox.css
    skin/classic/global/popup.css
    skin/classic/global/printPreview.css
    skin/classic/global/radio.css
    skin/classic/global/scrollbox.css
    skin/classic/global/splitter.css
    skin/classic/global/tabbox.css
    skin/classic/global/textbox.css
    skin/classic/global/toolbar.css

--- a/toolkit/themes/linux/global/numberbox.css
+++ b/toolkit/themes/linux/global/numberbox.css
@@ -1,18 +1,5 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
-/* ===== numberbox.css ==================================================
-  == Styles used by the XUL textbox type="number" element.
-  ======================================================================= */
-
-@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
-@namespace html url("http://www.w3.org/1999/xhtml");
-
-html|*.numberbox-input {
-  text-align: right;
-}
-
-textbox[type="number"][hidespinbuttons="true"] html|*.numberbox-input {
-  -moz-appearance: textfield !important;
-}
+%include ../../shared/numberbox.inc.css

--- a/toolkit/themes/osx/global/jar.mn
+++ b/toolkit/themes/osx/global/jar.mn
@@ -17,17 +17,17 @@ toolkit.jar:
 * skin/classic/global/findBar.css
 * skin/classic/global/global.css
   skin/classic/global/groupbox.css
   skin/classic/global/listbox.css
   skin/classic/global/menu.css
   skin/classic/global/menulist.css
 * skin/classic/global/notification.css
   skin/classic/global/netError.css
-  skin/classic/global/numberbox.css
+* skin/classic/global/numberbox.css
   skin/classic/global/popup.css
   skin/classic/global/progressmeter.css
   skin/classic/global/radio.css
   skin/classic/global/resizer.css
   skin/classic/global/richlistbox.css
   skin/classic/global/scrollbars.css                                 (nativescrollbars.css)
   skin/classic/global/scrollbox.css
   skin/classic/global/splitter.css

--- a/toolkit/themes/osx/global/numberbox.css
+++ b/toolkit/themes/osx/global/numberbox.css
@@ -1,15 +1,9 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
-@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
-@namespace html url("http://www.w3.org/1999/xhtml");
+%include ../../shared/numberbox.inc.css
 
 html|*.numberbox-input {
-  text-align: right;
   padding: 0 1px !important;
 }
-
-textbox[type="number"][hidespinbuttons="true"] html|*.numberbox-input {
-  -moz-appearance: textfield !important;
-}

copy from toolkit/themes/linux/global/numberbox.css
copy to toolkit/themes/shared/numberbox.inc.css
--- a/toolkit/themes/linux/global/numberbox.css
+++ b/toolkit/themes/shared/numberbox.inc.css
@@ -11,8 +11,32 @@
 
 html|*.numberbox-input {
   text-align: right;
 }
 
 textbox[type="number"][hidespinbuttons="true"] html|*.numberbox-input {
   -moz-appearance: textfield !important;
 }
+
+/* input[type=number] uses display: flex; by default which is incompatible with XUL flexbox
+   Forcing XUL flexbox allows changing the size of the input. */
+html|*.numberbox-input,
+html|*.numberbox-input::-moz-number-wrapper,
+html|*.numberbox-input::-moz-number-spin-box {
+  display: -moz-box;
+  -moz-box-align: center;
+}
+
+html|*.numberbox-input::-moz-number-spin-box {
+  -moz-box-orient: vertical;
+}
+
+html|*.numberbox-input::-moz-number-wrapper,
+html|*.numberbox-input::-moz-number-spin-up,
+html|*.numberbox-input::-moz-number-spin-down,
+html|*.numberbox-input::-moz-number-text {
+  -moz-box-flex: 1;
+}
+
+html|*.numberbox-input::-moz-number-wrapper {
+  width: 100%;
+}

--- a/toolkit/themes/windows/global/jar.mn
+++ b/toolkit/themes/windows/global/jar.mn
@@ -17,17 +17,17 @@ toolkit.jar:
   skin/classic/global/tabbox.css
   skin/classic/global/textbox.css
   skin/classic/global/colorpicker.css
   skin/classic/global/commonDialog.css
   skin/classic/global/findBar.css
 * skin/classic/global/global.css
   skin/classic/global/listbox.css
   skin/classic/global/netError.css
-  skin/classic/global/numberbox.css
+* skin/classic/global/numberbox.css
 * skin/classic/global/notification.css
   skin/classic/global/printPageSetup.css
   skin/classic/global/printPreview.css
   skin/classic/global/scrollbox.css
   skin/classic/global/splitter.css
   skin/classic/global/toolbar.css
   skin/classic/global/toolbarbutton.css
 * skin/classic/global/tree.css

--- a/toolkit/themes/windows/global/numberbox.css
+++ b/toolkit/themes/windows/global/numberbox.css
@@ -1,18 +1,5 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
-/* ===== numberbox.css ==================================================
-  == Styles used by the XUL textbox type="number" element.
-  ======================================================================= */
-
-@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
-@namespace html url("http://www.w3.org/1999/xhtml");
-
-html|*.numberbox-input {
-  text-align: right;
-}
-
-textbox[type="number"][hidespinbuttons="true"] html|*.numberbox-input {
-  -moz-appearance: textfield !important;
-}
+%include ../../shared/numberbox.inc.css

--- a/toolkit/themes/windows/global/printPreview.css
+++ b/toolkit/themes/windows/global/printPreview.css
@@ -14,8 +14,12 @@
   list-style-image: url("chrome://global/skin/icons/Print-preview.png");
   -moz-image-region: rect(0px 16px 16px 0px);
 }
 
 .toolbar-landscape-page {
   list-style-image: url("chrome://global/skin/icons/Print-preview.png");
   -moz-image-region: rect(0px 32px 16px 16px);
 }
+
+#pageNumber {
+  width: 3ch;
+}