Hallo Uwe,
für dein erstes Problem möchtest Du Dich mit der Spezifität von CSS Selektoren beschäftigen. #page2 li
ist spezifischer als .current
, deshalb greift es nicht.
Proportional wachsende Schriften sind möglich. Nur: eine prozentuale Angabe als font-size hilft nicht, die bezieht sich nicht auf die Containergröße, sondern auf die Größe der Schrift im Elternelement.
Zum einen kannst Du mit Media-Queries ein sprungweises Wachsen der font-size erreichen, oder die Tab-Texte als SVG-Elemente mit Text darin darstellen und die SVG-Elemente prozentual zu den Tab-Größen skalieren.
Wie das mit SVG aussähe, zeige ich Dir hier: https://jsfiddle.net/nqcww4hu/. DON'T DO IT.
Ich würde das an Deiner Stelle aber keinesfalls tun, das kann sehr schnell zu klein oder zu riesig werden. Behalte eine klar lesbare Schrift, die von der Größe er zum Seitendesign passt, und sorge mit Media Queries dafür, dass dein Menü im Normalfall ein Dropdown-Menü ist und bei genügend breitem Bildschirm eine Folge von Tab-Reitern (mobile first Ansatz).
Rolf
sumpsi - posui - clusi