Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

iOS Safari Changing Font Size, webkit-text-size-adjust has no effect

I have a contract form I'm trying to view on mobile, and it needs to appear exactly as the final contract will appear, font size and all. There are input boxes on the contract, but it seems that iOS Safari is scaling up the font size in these boxes.

I have found -webkit-text-size-adjust, however, this is not solving the problem. How can I prevent iOS Safari from changing font size in this input box, or, have I misunderstood how this is happening?

Font size and text-size-adjust rules

Computed font size obeys no logic

Input box with huge text

like image 412
crdzoba Avatar asked Nov 30 '25 16:11

crdzoba


1 Answers

Make sure you are setting the initial scale in the <header>:

<meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, shrink-to-fit=no">

and make sure iOS Safari will not automatically scales text if it thinks the text is to small:

-webkit-text-size-adjust: none;
like image 63
Shiva127 Avatar answered Dec 02 '25 05:12

Shiva127



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!