Closed moylesp closed 3 years ago
Thanks for raising this @moylesp . I've had a look, and it looks like this is happening because the font-size of the file upload button isn't changing as it should do (and as it does in other browsers). On mobile, the button and the text are both 16px and therefore align correctly. However, on desktop they should both be 19px but in Safari this only applies to the text which pushes it out of alignment.
To me, this looks like a Safari bug as it doesn't seem possible to change the font-size of the file upload button. Strangely enough, this only seems to work if you also set the background color using ::-webkit-file-upload-button
. I've raised an issue with Safari, so we'll have to see what comes back from that.
Description of the issue
When viewing option to upload a file using the Choose File button, the associated text of no file selected does not align correctly.
Steps to reproduce the issue
open link in Safari browser https://design-system.service.gov.uk/components/file-upload/
Actual vs expected behaviour
I would expect that the text would align correctly. This does happen if you reduce the size of the browser window and can display correctly
Environment (where applicable)
I am testing on the Land Registry web site, but I have included a link to the file uploader example https://design-system.service.gov.uk/components/file-upload/
Operating system: Mac Catalina
Browser: Safari
Browser version:
GOV.UK Frontend Version: