css background image

[mirko22]

Hallo,

ich will ein table menü mit css nachbauen, habe aber leider einige Probleme.

Das Menü hat oben und unten auslaufende schatten als Grafik. In der Mitte eine grafik repeat die links und rechts einen geraden Schatten darstellt. Mein problem ist die Grafik in der Mitte, die sich wiederholen soll, aber oben und unten die auslaufende Grafik nicht überlappen soll. Somit also eine Grafik oben eine unten und in der Mitte die Grafik die sich mit repeat wiederholt. Jetzt kommt das eigentliche Mneü welches mit <ul><li>die größe erst mitgibt, so kann ich also die grafik in der mitte nicht mit einer festen größe belegen, weil diese sich verändern kann.

Das menü habe ich hier gefunden:
http://www.agila.de/tier-op-versicherung/hunde-katzen-op-versicherung-faq
(links)

hat jemand Tipps, wie ich die Grafiken in div`s unterbringen kann? So das die mittlere grafik als repeat die obere und untere grafik nicht überlappt?

freu mich auf eure hilfe.

 

[threadi]

Wie sieht denn dein Versuch dazu bisher aus?

 

[mirko22]

<div class="links">
<div class="rechts">
<ul><li>....</li></ul>
</div></div>

.links {background: url() left;}
.rechts{background: url() right;}

jetzt habe ich das zwischen Stück ohne Probleme rechts und links abgebildet und es passt sich auch an die Größe des Menüs an. Aber sobald ich jetzt mit weiteren div`s versuche die Endstücke anzufügen oben und unten, überlappen diese mit dem anderen Schatten. Ich weiß einfach nicht, wie ich es schaffen kann, den mittleren Schatten nach oben und unten abzugrenzen....