0

Regardless the measure that I use (percent, em, px, etc) the sites, at least on mobile browsers, on Mozilla and Internet Explorer or Chrome, NEVER show the same font-size.

I tried even putting this on the CSS body rules

body
 {
-webkit-text-size-adjust:none;
-ms-text-size-adjust:none;
-moz-text-size-adjust:none;
text-size-adjust:none;
}

But didn´t work. Anyone knows how to fix it, or, leastwise, reduce the difference between those sizes no matter the size (and the less size of mobile browsers) that I use…? Thanks!

Tom
  • 91
  • 9

2 Answers2

0

The workaround for this is here https://stackoverflow.com/a/15137584/202550. I thinks some of suppress adjustment conditions are triggered and this works.

Set a real big max-height for the text's container and this will work like text-size-adjust: none:

.text {
    max-height: 5000em;
}

Then use this class anywere in HTML:

<p class="text">Lorem...</p>
Community
  • 1
  • 1
starikovs
  • 3,240
  • 4
  • 28
  • 33
-1

If you really need to control this, your best best is to use a "css reset" or "css normalize" library (e.g. http://nicolasgallagher.com/about-normalize-css/).

Usually, there's some general rules you stick in html/body and probably a few that take advantage of browser-specific css features in order to tweak a few particulars. You'll probably end up needing to muck with line-height, input elements, and a host of other bits and pieces, too. It's really much easier to use a library.

Pete Scott
  • 1,516
  • 10
  • 10
  • But I'd avoid messing with it at all if it's just the inconsistency bothering you. If it actually makes the layout difficult to handle, then certainly do it. If at all possible, just let the browser do what it does. – Pete Scott Aug 12 '15 at 23:40
  • The real problem is that `text-size-adjust` does't work correctly. – starikovs Aug 20 '15 at 11:01