Oftmals wird empfohlen, dass man die Schriftgröße (oder auch die Breite von Containern) in der Einheit rem angibt, damit die im Browser eingestellte Standard Schriftgröße berücksichtigt wird.
Seit einigen Wochen unterstützen die großen Browser Container Query Units.
Ich möchte die Schriftgröße flexibel nach der Breite des Containers gestalten und zusätzlich in der Einheit rem.
Die Schriftgröße sollte bei einer Container-Breite von 280 Pixel (fast 18rem) 1rem betragen.
Bei einer Container-Breite von 980 Pixel (61,25rem wenn die Standard-Schriftgröße 16 Pixel beträgt) so die Schriftgröße 1,25rem betragen.
Also eine lineare Funktion.
Und so habe ich das umgesetzt:
Code:
:root {
--fs: calc((1cqi / 28) + 0.9);
}
p {
font-size: var(--fs)rem;
}
Das Ganze funktioniert aber nicht.
Kann das gar nicht funktionieren oder habe ich da etwas falsch gemacht?