Menu
On my website I use these fonts: font-family: Segoe UI, Verdana, Geneva, sans-serif
Verdana looks kind of like Segoe UI and is a nice fallback for Macs & iOS devices. Now the problem is that Verdana is just a lot bigger than Segoe UI so on some devices the fonts are just too big.
I cannot seem to figure out how to set the font-size depending on the font applied; 18px for segoe ui and 16px for verdana for example?
Any idea how I could do this using only css?
thanks!
559
A fallback font is a reserve typeface containing symbols for as many Unicode characters as possible. When a display system encounters a character that is not part of the repertoire of any of the other available fonts, a symbol from a fallback font is used instead.
font-family: font-name; but we can also set fallback fonts which would be: font-family: font-1, font-2, font-3; If Font 1 isn't available, font-2 would be used, and so on.
So the candidate fallback fonts are Arial / Helvetica, Trebuchet MS, and Verdana.
You could use the ex unit but its implementation has been buggy for some browsers.
Another alternative is using the font-size-adjust property which is supported by Gecko powered browsers.
94
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
