Tim Tepaße: Grafiken beim Überfahren mit der Maus highlighten

Beitrag lesen

Hallo,

Das ganze funktioniert zwar, jedoch verschwindet mit dem img auch der Link, also es ist nicht mehr die gesammte Fläsche der TD anklickbar sondern nur noch ein sehr kleiner Bereich...

Es wäre sehr viel hilfreicher, würdest Du einfach mal am Anfang den betreffenden Quellcode posten. Von dem Link hör ich zum ersten Mal. Allerdings kann ich Dein geschildertes Problem so nicht nachvollziehen. Ich habe folgende HTML-Struktur:

~~~html <table>
    <tr>
      <td><a href="http://google.de"><span>Dingsbums</span></a></td>
    </tr>
  </table>

  
Die Rollen Deines Bildes spielt hier das Inline-Element span. Darauf dieses CSS angewandt, in dem ich das Hintergrundbild durch Hintergrundfarbe ersetze, weil ich gerade keines zur Hand habe:  
  
  ~~~css
td {  
      border:1px solid black;  
      width:100px;  
      height:100px;  
      padding:0;  
  }  
  
  td a {  
      display:block;  
      margin:0;  
      padding:0;  
      height:100%;  
      background-color:red;  
  }  
  
  td a span {  
      display:block;  
      width:100%;  
      height:100%;  
      background-color:green;  
  }  
  
  td:hover span {  
      visibility:hidden;  
  }

Beachte wie ich explizit dem Link und dem span im Link sage, dass sie Blockelemente sind und bitteschön 100% der zur Verfügung stehenden Breite und Höhe einnehmen sollen. a, span und img sind Inline-Elemente, die sind normalerweise recht klein. Wenn man will, dass sie allen Platz der Tabellenzelle einnehmen muss man ihnen das sagen.

Kleine Warnung: Das, was ich hier mit width und height für span mache, gilt nicht für Dein Bild. Im Gegensatz zu einem Textelement hat dieses ja schon die passende Größe.

Tim