Michael: spezielle CSS Formatierung

Hallo,

nach stundenlangem Probieren bin ich zu dem Entschluss gekommen, dass mein Vorhaben evtl. gar nicht realisierbar ist, aber vielleicht belehrt ihr mich eines besseren ;-)

Ich stehe vor folgendem Problem:

Ich habe eine Tabellenzelle die 200x200 Pixel groß ist. In dieser Zelle befindet sich ein Link. Wenn man jetzt über den Link fährt, soll sich der Zellenhintergrund der Tabelle farblich ändern.

Danke im Vorraus für eure Hilfe.

Beste Grüße
Michael

  1. Hi Michael,

    Ich habe eine Tabellenzelle die 200x200 Pixel groß ist. In dieser Zelle befindet sich ein Link. Wenn man jetzt über den Link fährt, soll sich der Zellenhintergrund der Tabelle farblich ändern.

    Das wird so erst mal nicht gehen - du hast aber zwei Möglichkeiten an das Problem ranzugehen:

    1. Du setzt direkt ein :hover auf die Tabellenzelle, dass funktioniert dann allerdings nicht im IE
    2. Du lässt den Link als Blockelement darstellen (display:block), weitest ihn über die ganze Tabellenzelle aus, gibts ihm eine Hintergrundfarbe und ein entsprechendes :hover. Dann kann man allerdings (was ja eigentlich gut ist) auf den ganzen Bereich der Tabellenzelle klicken, um dem Link zu folgen.

    Eine letzte möglichkeite wäre natürlich ganz auf Tabellen zu verzichten ;-) Wenn es sich in deinem Beispeiel um eine Navigation handelt, solltest du eh besser verschachtelte Listen nehmen.

    MfG, Dennis.

    1. Hallo,

      vielen Danke für die Hinweise mit Blockelement. Genau danach hatte ich gesucht. Was wäre ich nur ohne dieses Forum ;-)

      Beste Grüße
      Michael

  2. hi,

    Ich habe eine Tabellenzelle die 200x200 Pixel groß ist. In dieser Zelle befindet sich ein Link. Wenn man jetzt über den Link fährt, soll sich der Zellenhintergrund der Tabelle farblich ändern.

    dann machst du am besten den link genauso groß wie die tabellenzelle, und änderst per a:hover seinen hintergrund.

    display:block für den link, dann kannst du ihm ggf. auch eine höhe verpassen. und der IE möchte zusätzlich zu display:block eine explizite width-angabe, damit er das umsetzt.

    gruß,
    wahsaga

    --
    /voodoo.css:
    #GeorgeWBush { position:absolute; bottom:-6ft; }