Hallo,
ich suche nach einer Möglichkeit die Font-Size des von mir angegebenen Fallback-Fonts per CSS anzupassen.
Folgendes Szenario:
HTML
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<link href='https://fonts.googleapis.com/css?family=Galdeano' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Crimxson+Text:400,400italic,600,600italic,700,700italic' rel='stylesheet' type='text/css'>
<style>
body {
font-family: 'Crimson Text', Palatino Linotype, Book Antiqua, Palatino, serif;
font-weight: 400; /* number OR normal|bold|bolder|lighter|initial|inherit */
font-size: 1.1rem;
font-size: 18px; /* for IE 8 */
}
h2 {
font-family: 'Galdeano', Trebuchet MS, Helvetica, sans-serif;
font-weight: 400; /* number OR normal|bold|bolder|lighter|initial|inherit */
font-size: 1.5rem;
}
img {
float:right;
}
</style>
</head>
<body>
<h2>Überschrift</h2>
Fließtext ... <img ...>
</body>
</html>GAU: User blockiert Google Fonts.
Ergebnis: Der Fallback-Font "Palatino Linotype" ist größer als der Font "Crimson Text". Das ganze Style gerät durcheinander. (u. a. wegen "float:..." bei <img>)
Frage: Wie kann dem Fallback-Font eine eigene Font-Size gegeben werden?