Wie würden die Profis das lösen?

[Ben.]

Hallo,

Ich habe ein horizontales Menü per unorderedList erstellt (ul / li) und entsprechende StyleSheets integriert. Jetzt möchte ich beim onMouseOver / Hover gerne eine abgerundete Unterkante einblenden.

Ich bin kein Profi was CSS angeht, daher würde ich gerne wissen, wie ihr das lösen würdet. Jedes Menü-Element als einzelne Grafik? Natürlich wäre mir sowenig Grafik wie möglich recht.

Ein Screenshot wie ich mir das ungefähr vorstelle:

website_templ2.jpg (22.21 KiB) 179-mal betrachtet

Könnt ihr mir da helfen?

Vielen Dank schonmal.

[sejuma]

Einfach bei a:hover eine entsprechende Hintergrundgrafik hinterlegen.
Ähnlich hier, Ziffer 2: http://www.ohne-css.gehts-gar.net/0022.php

[Ben.]

Danke für deine Antwort. Dann würdest du den gesamten Button als Grafik machen? Denn die Hintergrundgrafik müsste sich ja dynamisch mit der Textlänge anpassen, allerdings verzieht sich dann der Text. Und zum anderen würde der Text springen, wenn plötzlich die Masse ander sind, oder nicht?

Das Grün ist jetzt eine Hintergrundfarbe.

[sejuma]

Wenn man auf die runden Ecken verzichten könnte, würde eine kleine Kachelgrafik ausreichen, die sich der Inhaltsbreite anpasst (repeat: x-repeat;).
Ansonsten entweder für jeden Link einen individuellen Button nehmen oder eine Linkbreite nehmen, die einheitlich der des längsten Textes entspricht.

Es könnte aber auch noch eine Kachellösung mit den runden Ecken geben, nur ist mir die momentan nicht geläufig. Evtl. mals selbst googeln.