Attributvergabe in CSS

[Gunnar Bittersmann]

@@Gerd

Wenn es nur für eine bestimmte Tabelle gelten soll, ist dann folgendes korekt?

Nein.

table.v1 th, td {
  &.Land {
    text-align: left;
  }
}

Das wäre aufgedröselt

table.v1 th.Land, td.Land {
  text-align: left;
}

selektiert also alle th-Elemente der Klasse Land, die sich in einer table der Klasse v1 befinden, sowie alle td-Elemente der Klasse Land (egal, ob sie sich in einer table der Klasse v1 befinden oder nicht).

Um th, td muss eine Klammer drum:

table.v1 :is(th, td) {
  &.Land {
    text-align: left;
  }
}

Oder so:

table.v1 {
  th, td {
    &.Land {
      text-align: left;
    }
  }
}

Aber: Selbst wenn es außerhalb der Tabelle noch Elemente der Klassen Land etc. geben sollte, werden die ja im Kontext table.v1 nicht selektiert. Das heißt: die Elementtypen brauchst du überhaupt nicht.

table.v1 {
  .Land {
    text-align: left;
  }
}

Dass das & jetzt weggefallen ist, hat seine Richtigkeit. .Land bezieht sich ja nicht auf das Element table.v1, sondern auf Nachfahren davon.

🖖 Live long and prosper