Benötige Hilfe bezüglich Link-Verschiebung

[Felix Riesterer]

Lieber Matthias,

Klick mich

Du hast Dir mit Deiner <div>-Suppe selbst ein Bein gestellt. Hättest Du sinnvollen Code benutzt, dann wäre das alles überhaupt kein Problem gewesen.

Vorschlag: Wandle Deinen Code so um, dass Deine Links innerhalb von Listenelementen stehen.

<h1>Adventskalender</h1>  
<ul id="kalender">  
    <li><a href="..." id="tuer_1"><span>1. Türchen</span></a></li>  
    <li><a href="..." id="tuer_2"><span>2. Türchen</span></a></li>  
    <li><a href="..." id="tuer_3"><span>3. Türchen</span></a></li>  
    ...  
</ul>

So. Mit diesem Code kannst Du dem <ul>-Element Dein Kalenderbild als Hintergrundbild zuweisen. Wenn dieses <ul>-Element dann auch noch position:relative verpasst bekommt, dann gilt seine linke obere Ecke als Ursprungspunkt für alle top und left werte der absolut positionierten <a>-Elemente.

Damit in den Links keine störenden Textelemente angezeigt werden, kannst Du die <span>-Elemente mit display:none unsichtbar machen. Falls jemand CSS deaktiviert, ist die Seite sinnvoll nutzbar.

Mit Deinen gegenwärtigen "Koordinaten" klappt das "Zurechtrücken" des Bildes allerdings nicht. Selbst wenn ich mit den Werten für die x- und y-Ausrichtung spiele, werden nur ein paar "Links" korrekt auf dem Hintergrundbild abgebildet. Daher ist mein obiger Ansatz sehr wesentlich, wenn Dein Vorhaben gelingen soll. Und wenn Du das Ausprobieren der neuen Koordinaten scheust, dann hast Du wahrscheinlich noch nicht ausprobiert, wie toll man im Firefox mit dem Firebug-Plugin solche Dinge im Handumdrehen ausprobieren und anpassen kann.

Liebe Grüße,

Felix Riesterer.