Em doesn't work on iPhone Browser

I installed my fonts specifically as follows

* {font-size: 1em;}
html {font-size: 125%;}
body{font-size: 50%;}
p, ul, ol{line-height:1.7em; font-size:1.2em; margin-bottom:0.5em; }


Works great on desktop browsers and iPad (view identical) - however font size doesn't decrease on iphone?

What am I doing wrong?


source to share

1 answer

There are several solutions to your problem. Alternatively, apply a text-size-adjust

WebKit-specific property :

html {
  /* Prevent WebKit-based browsers from resizing the text: */
  -webkit-text-size-adjust: none;


Or you can define the width of the viewport in your HTML:

<meta name="viewport" content="width=device-width">


This tells the browser to use the viewport width equal to the physical width of the devices. In most cases, this prevents strange document text by changing the inconsistency as well.



All Articles