Joachim_Siebert: Href und Divs kombinieren

Beitrag lesen

Hallo,

ich habe das folgende Problem.
Ich lade ein Produktbild und lege auf das Produktbild eine Transparentes Gif mit "Sonderangebot" drauf. Leider Funktioniert dadurch mein Href auf das Bild nicht mehr.

  
<div class="AngebotProduktBild">  
 <a href='#test1'>  
  <img src='produktbild.jpg' width='140' height='140'/>  
 </a>  
</div>  
  
<!-- dann noch das transparente Sonder.gif drüber -->  
<div class="AngebotHighlighter"></div>  

Im css habe ich das so gemacht:

  
.AngebotProduktBild  
{  
width:140px;  
height:140px;  
z-index:0;  
}  
.AngebotHighlighter  
{  
    border: 1px dotted #C0C0C0;  
    background: url(images/AngebotHighlighter.gif);  
    position: relative;  
    top: -140px;  
    left: 1px;  
    width: 140px;  
    height: 140px;  
    z-index: 1;  
    background-repeat: no-repeat;  
}  

Ich denke, weil das transpartent Sonder.gif einen höhern z-index hat, funktioniert der Link nicht mehr.

Ich muss also im "oberen" div das ahref machen ... Ich habe das so versucht:

  
<div class="AngebotProduktBild">  
 <img src='produktbild.jpg' width='140' height='140'/>  
</div>  
<div class="AngebotHighlighter">  
 <a href="#" style="height: 140px; width: 140px; border: 1px solid black; z-index: 2; top:-60;">Zur nächsten Seite</a>  
</div>  

Leider funktioner es nicht!

Wo liegt mein Denkfehler?

Danke für die creative mitdenkthilfe!!!

Joachim