Rolf B: komplette Tabellenzeile verlinken

Beitrag lesen

Hallo Meowsalot,

eine Alternative wäre, keine Table einzusetzen, sondern eine Liste, deren Items aus einem <a> Element bestehen. Dieses <a> stylest Du per CSS als display:block und setzt eine <dl> hinein, die z.B. als display:flex gestyled ist damit du problemlos die 9:1 Breitenverteilung hinbekommst.

<li>
  <a href="...">
    <dl>
      <dt>
      <dd>
    </dl>
  </a>
</li>

Man kann das auch vereinfachen zu

<li>
  <a href="...">
    <div>
    <div>
  </a>
</li>

Allerdings finde ich von der Natur der Sache her eine Description List schöner.

Damit hättest Du dann durchgehende Links und wenn jemand mit TAB durchläuft, muss er nicht durch die Spalten springen. Die Frage nach der vollen Höhe stellt sich auch nicht.

Beispiel-Fiddle mit CSS

Ob das den Segen der HTML-Päpste findet, weiß ich natürlich mal wieder nicht :)

Rolf

--
sumpsi - posui - clusi
0 75

komplette Tabellenzeile verlinken

Meowsalot
  • html
  1. 0
    dedlfix
    1. 0
      Meowsalot
      • css
      • html
      1. 0
        dedlfix
        1. 0
          Rolf B
        2. 0
          Meowsalot
    2. 1
      Gunnar Bittersmann
      1. 0
        dedlfix
        1. 0
          Gunnar Bittersmann
          1. 0
            marctrix
            1. 0
              Gunnar Bittersmann
              1. 0
                marctrix
                1. 0
                  Gunnar Bittersmann
                  1. 0
                    marctrix
  2. 0
    Rolf B
    1. 0
      Gunnar Bittersmann
      1. 0
        Rolf B
        1. 0
          Gunnar Bittersmann
        2. 3
          Henry
      2. 0
        beatovich
        1. 0
          JürgenB
          1. 0
            beatovich
            1. 0
              JürgenB
              1. 1
                beatovich
                1. 0
                  JürgenB
                  1. 0
                    beatovich
                    1. 3
                      JürgenB
                      1. 0
                        beatovich
          2. 0
            marctrix
        2. 1
          Gunnar Bittersmann
          1. 0
            beatovich
            1. 0
              Tabellenkalk
              1. 0
                beatovich
                1. 0
                  Tabellenkalk
                2. 0
                  Gunnar Bittersmann
                  1. 0
                    Tabellenkalk
                  2. 0
                    Rolf B
    2. 0
      marctrix
  3. 0
    Henry
    • html
    • javascript
    • tabelle
    1. 0
      Henry
    2. 0
      marctrix
  4. 1
    Gunnar Bittersmann
    • css
    1. 0
      JürgenB
      1. 0
        Gunnar Bittersmann
        1. 1
          Gunnar Bittersmann
          • javascript
          1. 0
            Henry
            1. 0
              Gunnar Bittersmann
              1. 0
                Henry
                1. 0
                  Gunnar Bittersmann
                  1. 0

                    Warum immer Codepen?

                    Henry
                    • css
                    • editor
                    • meinung
                    1. 1
                      Rolf B
                      1. 0
                        Henry
                        1. 0
                          dedlfix
                        2. 0
                          marctrix
                      2. 1
                        Matthias Apsel
                    2. 0

                      komplette Tabellenzeile verlinken

                      Gunnar Bittersmann
                      • javascript
          2. 0
            Meowsalot
            1. 0
              marctrix
              1. 1
                Gunnar Bittersmann
                • barrierefreiheit
                • css
                • tabelle
                1. 0
                  marctrix
              2. 1
                MudGuard
                1. 0
                  marctrix
            2. 1
              Gunnar Bittersmann
              • css
              1. 0
                Meowsalot
                1. 1
                  Gunnar Bittersmann
                  • css
                  • html
                  1. 0
                    Meowsalot
                    1. 0
                      Matthias Apsel
                      • css
                      1. 0
                        Meowsalot
                      2. 0
                        Gunnar Bittersmann
                        • menschelei
                        1. 0
                          Tabellenkalk
                    2. 2
                      dedlfix
    2. 0
      Meowsalot
      1. 0
        marctrix
        1. 0
          Meowsalot
          • css
          • javascript
    3. 1
      dedlfix