Colspan alle Spalten

Question

Wie kann ich angeben, dass ein td-Tag alle Spalten umfassen soll (wenn die genaue Anzahl der Spalten in der Tabelle variabel/schwer zu bestimmen ist, wenn der HTML-Code gerendert wird)? w3schools erwähnt, dass Sie colspan="0" verwenden können, sagt aber nicht genau, welche Browser diesen Wert unterstützen (IE 6 steht auf unserer Liste der zu unterstützenden Browser).

Es scheint, dass das Festlegen von colspan auf einen Wert größer als die theoretische Anzahl der Spalten, die Sie haben können, funktioniert, aber nicht, wenn Sie table-layout auf fixed setzen. Gibt es Nachteile bei der Verwendung eines automatischen Layouts mit einer großen Anzahl für colspan? Gibt es eine korrektere Möglichkeit, dies zu tun?

Answer 1

Nur dies verwenden:

colspan="100%"

Es funktioniert auf Firefox 3.6, IE 7 und Opera 11! (und ich vermute auf anderen, aber ich konnte es nicht ausprobieren)

---

Warnung: wie in den Kommentaren unten erwähnt ist dies tatsächlich dasselbe wie colspan="100". Daher wird diese Lösung für Tabellen mit CSS table-layout: fixed oder mehr als 100 Spalten nicht funktionieren.

Answer 2

Ich habe IE 7.0, Firefox 3.0 und Chrome 1.0

Das colspan="0" Attribut in einem TD spannt NICHT über alle TDs in einem der oben genannten Browser.

Vermutlich nicht als ordentliche Markup-Praxis empfohlen, aber wenn Sie einen höheren colspan-Wert als die Gesamtzahl der möglichen Spalten in anderen Zeilen angeben, dann würde das TD über alle Spalten spannen.

Dies funktioniert NICHT, wenn die table-layout CSS-Eigenschaft auf fixed gesetzt ist.

Nochmals, dies ist nicht die perfekte Lösung, aber es scheint in den oben genannten 3 Browser-Versionen zu funktionieren, wenn die table-layout CSS-Eigenschaft auf automatisch gesetzt ist.

Answer 3

Wenn Sie eine 'title'-Zelle erstellen möchten, die alle Spalten überspannt und als Kopfzeile für Ihre Tabelle dient, möchten Sie möglicherweise das caption-Tag verwenden (http://www.w3schools.com/tags/tag_caption.asp / https://developer.mozilla.org/en-US/docs/Web/HTML/Element/caption) Dieses Element ist dafür gedacht. Es verhält sich wie ein div, überspannt jedoch nicht die gesamte Breite des Elternelements der Tabelle (wie ein div es an derselben Stelle tun würde (probieren Sie dies nicht zu Hause aus!)), sondern die Breite der Tabelle. Es gibt einige browserübergreifende Probleme mit Rahmen und ähnlichem (das war für mich akzeptabel). Wie auch immer, Sie können es wie eine Zelle gestalten, die alle Spalten überspannt. Darin können Sie Zeilen durch Hinzufügen von div-Elementen erstellen. Ich bin mir nicht sicher, ob Sie es zwischen tr-Elementen einfügen können, aber das wäre wohl ein Hack (also nicht empfohlen). Eine andere Option wäre das Herumspielen mit floatenden divs, aber das ist eklig!

Machen Sie

Machen Sie nicht

Answer 4

Als teilweise Antwort hier sind einige Punkte zu colspan="0", die in der Frage erwähnt wurden.

tl;dr Version:

colspan="0" funktioniert in keinem Browser überhaupt. W3Schools liegt falsch (wie üblich). HTML 4 sagte, dass colspan="0" dazu führen soll, dass eine Spalte die gesamte Tabelle überspannt, aber niemand hat dies implementiert und es wurde nach HTML 4 aus dem Standard entfernt.

Weitere Einzelheiten und Beweise:

• Alle Hauptbrowser behandeln es als Äquivalent zu colspan="1".

  Hier ist eine Demonstration; probiere es in jedem Browser deiner Wahl aus.

  td {
    border: 1px solid black;
  }
  
      ay
      bee
      see
  
      colspan="0"
  
      colspan="1"
  
      colspan="3"
  
      colspan="1000"

• Der HTML 4-Standard (jetzt alt und veraltet, aber aktuell, als diese Frage gestellt wurde) hat wohl tatsächlich gesagt, dass colspan="0" wie das Überspannen aller Spalten behandelt werden sollte:

  Der Wert Null ("0") bedeutet, dass die Zelle alle Spalten von der aktuellen Spalte bis zur letzten Spalte der Spaltengruppe (COLGROUP) spannt, in der die Zelle definiert ist.

  Die meisten Browser haben dies jedoch nie implementiert.

• HTML 5.0 (als Kandidatenempfehlung im Jahr 2012 veröffentlicht), der WhatWG HTML Leitfaden (der dominierende Standard heute) und der neueste W3 HTML 5-Standard enthalten alle nicht die oben zitierten Formulierungen aus HTML 4 und stimmen einstimmig darin überein, dass ein colspan von 0 nicht erlaubt ist, mit dieser Formulierung, die in allen drei Standards erscheint:

  Die Elemente td und th können über ein festgelegtes colspan-Attribut verfügen, dessen Wert eine gültige nichtnegative ganze Zahl größer als Null sein muss ...

  Quellen:

  • https://www.w3.org/TR/html50/tabular-data.html#attributes-common-to-td-and-th-elements
  • https://html.spec.whatwg.org/multipage/tables.html#attributes-common-to-td-and-th-elements
  • https://www.w3.org/TR/html53/tabular-data.html#attributes-common-to-td-and-th-elements

• Die folgenden Aussagen auf der in der Frage verlinkten W3Schools-Seite sind heutzutage - zumindest - vollständig falsch:

  Nur Firefox unterstützt colspan="0", was eine spezielle Bedeutung hat ... [Es] sagt dem Browser, die Zelle bis zur letzten Spalte der Spaltengruppe zu spannen (COLGROUP)

  und

  Unterschiede zwischen HTML 4.01 und HTML5

  KEINE.

  Wenn du noch nicht weißt, dass W3Schools von Webentwicklern aufgrund seiner häufigen Ungenauigkeiten generell verachtet wird, betrachte dies als Lektion dafür.

Answer 5

Für den IE 6 sollten Sie colspan auf die Anzahl der Spalten in Ihrer Tabelle setzen. Wenn Sie 5 Spalten haben, sollten Sie also colspan="5" verwenden.

Der Grund dafür ist, dass der IE colspans anders behandelt, er verwendet die HTML 3.2 Spezifikation:

IE implementiert die HTML 3.2 Definition, es setzt colspan=0 als colspan=1.

Der Bug ist gut dokumentiert.