224746 2021-04-19 03:36:35 -0700 font-size property doesn't apply to file upload button 2023-01-10 17:38:12 -0800 1 1 1 Unclassified WebKit Forms Safari 14 Mac (Intel) macOS 10.15 RESOLVED DUPLICATE 238803 https://bugs.webkit.org/show_bug.cgi?id=238803 InRadar P2 Normal --- 1 vanita.barrett webkit-unassigned akeerthi cdumez ntim oliver.byford simon.fraser webkit-bug-importer wenson_hsieh zalan oldest_to_newest 1751724 0 426404 vanita.barrett 2021-04-19 03:36:35 -0700 Created attachment 426404 HTML example (alternative to CodePen) ## What When applying the `font-size` property to a file upload input, the font-size of the file upload button does not change. This happens even when applying the font-size property using the ::-webkit-file-upload-button selector. Strangely, the font-size does change when the file upload has a background-color applied using ::-webkit-file-upload-button. ## Steps to reproduce 1. Open https://codepen.io/vanitabarrett/pen/qBRMPQw (or attached file) in Safari 2. The first file upload has the 'no file selected' text mis-aligned with the input button 3. The second file upload has the 'no file selected' correctly aligned and the file upload button font-size matches 1752404 1 akeerthi 2021-04-20 13:29:22 -0700 Thanks for the report! I'm also able to reproduce using an <input type=button>. We've had this behavior for a long time, since the native rounded button style does not support variable sizes. It works when you specify a "background-color", since that drops us out of the native appearance. A workaround, if you do not require a native appearance, would be to specify "-webkit-appearance: none". However, we could probably fix this by transitioning to the native square button style for larger font sizes (as we already do for <button>). 1754149 2 webkit-bug-importer 2021-04-26 03:37:16 -0700 <rdar://problem/77146163> 1923914 3 ntim 2023-01-07 23:28:03 -0800 Bug 238803 would fix this, among with other issues! 1924664 4 ntim 2023-01-10 17:38:12 -0800 Bug 238803 fixes it. *** This bug has been marked as a duplicate of bug 238803 *** 426404 2021-04-19 03:36:35 -0700 2021-04-19 03:36:35 -0700 HTML example (alternative to CodePen) file-upload.html text/html 653 vanita.barrett PCFkb2N0eXBlIGh0bWw+Cgo8aHRtbCBsYW5nPSJlbiI+CjxoZWFkPgogIDxtZXRhIGNoYXJzZXQ9 InV0Zi04Ij4KCiAgPHRpdGxlPkZpbGUgVXBsb2FkIGZvbnQtc2l6ZTwvdGl0bGU+CjwvaGVhZD4K Cjxib2R5PgogIDxzdHlsZT4KICAgIC5teS1maWxlLXVwbG9hZCB7CiAgICAgIGZvbnQtc2l6ZTog MzBweDsKICAgIH0KCiAgICAubXktZmlsZS11cGxvYWQ6Oi13ZWJraXQtZmlsZS11cGxvYWQtYnV0 dG9uIHsKICAgICAgZm9udC1zaXplOiAzMHB4OwogICAgfQoKICAgIC5teS1maWxlLXVwbG9hZC0y IHsKICAgICAgZm9udC1zaXplOiAzMHB4OwogICAgfQoKICAgIC5teS1maWxlLXVwbG9hZC0yOjot d2Via2l0LWZpbGUtdXBsb2FkLWJ1dHRvbiB7CiAgICAgIGJhY2tncm91bmQtY29sb3I6IHJlZDsK ICAgIH0KICA8L3N0eWxlPgoKICA8aDI+V2l0aCBmb250LXNpemUgb25seTwvaDI+CiAgPGlucHV0 IHR5cGU9ImZpbGUiIGNsYXNzPSJteS1maWxlLXVwbG9hZCIgaWQ9Im15RmlsZSIgbmFtZT0iZmls ZW5hbWUiPgoKICA8aDI+V2l0aCBiYWNrZ3JvdW5kIGNvbG9yIGFwcGxpZWQ8aDI+CiAgPGlucHV0 IHR5cGU9ImZpbGUiIGNsYXNzPSJteS1maWxlLXVwbG9hZC0yIiBpZD0ibXlGaWxlIiBuYW1lPSJm aWxlbmFtZSI+CjwvYm9keT4KPC9odG1sPgo=