IE 8 denkt, dass alle Tabellenzellen eine Spaltenüberschrift haben

Avatar of Chris Coyier
Chris Coyier am

DigitalOcean bietet Cloud-Produkte für jede Phase Ihrer Reise. Starten Sie mit 200 $ kostenlosem Guthaben!

Nathan Smith hat mich auf dieses kleine Juwel aufmerksam gemacht. IE 8 (nur) denkt, dass alle Tabellenzellen ein colspan-Attribut haben, egal ob sie es haben oder nicht. Wenn Sie also Tabellenzellen, die dieses Attribut haben, einzigartig gestalten möchten, ist das etwas schwierig.

td[colspan],
th[colspan] {
   /* WARNING: this will apply in IE 8 to table cells
      even if they don't have a colspan */
   background: red;
}

Was wir erwarten würden, wäre so etwas wie das hier

Stattdessen wird in IE 8 jede einzelne Tabellenzelle abgeglichen

Dies ist absolut einzigartig für IE 8. Weder 7 noch 9 tun dies, und 6 unterstützt keine Attributselektoren, also fällt das ohnehin weg. Er denkt auch, dass der Wert von colspan 1 ist, also fallen all diese weg

th[colspan],
th[colspan="1"],
th[colspan*="1"],
th[colspan^="1"],
th[colspan$="1"],
td[colspan],
td[colspan="1"],
td[colspan*="1"],
td[colspan^="1"],
td[colspan$="1"] {
  
	/* All problematic in IE 8 */ 

}

Lösung

Wenn Sie diesen Selektor wirklich zum Laufen bringen müssen, können Sie stattdessen nach colspan-Werten auswählen, die etwas anderes als den Wert 1 haben. Ein bisschen umständlich, aber es funktioniert.

th[colspan*="0"],
th[colspan*="2"],
th[colspan*="3"],
th[colspan*="4"],
th[colspan*="5"],
th[colspan*="6"],
th[colspan*="7"],
th[colspan*="8"],
th[colspan*="9"],
th[colspan*="11"] {
  /* Styles */
}

td[colspan*="0"],
td[colspan*="2"],
td[colspan*="3"],
td[colspan*="4"],
td[colspan*="5"],
td[colspan*="6"],
td[colspan*="7"],
td[colspan*="8"],
td[colspan*="9"],
td[colspan*="11"] {
  /* Styles */
}