Why is the font size on Safari on Mac OS so much smaller?

I have a website that uses CSS for all of its styles, and on Windows, the string and font sizes are all compatible with Firefox, Opera, IE, Safari, Chrome.

I just tried it under Firefox on Mac (Snow Leopard), and fonts usually look a little bolder than windows, the overall size looks something like this.

However, on Safari on Mac, all fonts seem much smaller, line spacing is much stiffer.

What is the likely reason for this? Is this a known scenario, perhaps with a good workaround?

If you want to check the situation, this site: http://www.marcusstarnes.co.uk

thank

+3
source share
2 answers

Since you set the font size to em(good thing - do not change this!) The font size depends on the browser settings / user settings. You probably have a smaller font installed on Safari.

On the other hand, if you are in “all browsers should look like something, or the world will end”, then you should not use ems.

I am not sure about the line-height: 1reset stylesheet. It seems to me wrong ...

EDIT: Oh wait, I just discovered font-size:62.5%;. It does not change what I said, but for many it is inconvenient because you use two thirds of the preferred user size.

+4
source

, , . , , Safari Mac. , , reset :

html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

to

html { font-size: 16px; overflow-y: scroll; -webkit-text-size-adjust: 16px; -ms-text-size-adjust: 16px; }

"" , . , , , . , -, .

+1

Source: https://habr.com/ru/post/1756161/


All Articles