CSS - Bei Hover soll Box durch font-weight: bold nicht größer werden

[Rolf B]

Hallo ebody,

wenn Du nur ein Fragment in den Ring wirfst, dann musst Du Dich nicht wundern, wenn Die Antwort nicht hilfreich ist.

Du möchtest ein Menü bauen bei dem die Menüpunkte untereinander stehen? Und die Menübuttons (oder Links, wenn's ein Menü ist) alle gleich breit sind?

Möglichkeit 1: Mein Vorschlag mit text-shadow statt font-weight. CSS Only, klappt ab IE 10, sollte sich fast überall einfügen.

Möglichkeit 2: In der JavaScript-Lösung die maximale Breite des Rahmen-DIV (bzw. ul) des Menüs bestimmen - das richtet sich ja nach dem breitesten Menüpunkt, etwas Zuschlag geben und das als Breite setzen.

Möglichkeit 3: Feste Breite vergeben und auf Kopfschmerzen verzichten.

Aber vielleicht passt das immer noch alles nicht, weil Du uns noch nicht alles verraten hast (z.B. Submenüs die aufgeblendet werden oder das ganze Menü ist ein Popup Menü).

Nachtrag: In der JS Lösung muss man gar keinen Zuschlag berechnen. Wenn der Container der Menüpunkte feste Breite hat, vergrößert sich zwar der Text, aber der Rahmen in dem er steht, bleibt fix.

Wenn die Navigations-Links untereinander in einem nav Element stehen: Einfach die Breite annageln.

let navigation = document.querySelector("nav");
if (navigation) {
   navigation.style.width = navigation.clientWidth + "px"
}

Rolf