Zellen und Zeilen einer Tabelle ausblenden

[robertroth]

Liebe Mitdenker, liebe Wissende, liebe Neugierige,

ja!

Ich möchte gerne mit CSS steuern, dass leere Zeilen einer Tabelle nicht angezeigt werden. Versuche kurz zusammengefasst:

		table {
			border: 1px solid #000000;
			padding: 3px; 
			border-collapse: collapse;
			cell-spacing: 0;	
/*			empty-cells: show; */
		}
		
		tr:empty {
			display: none;
		}	
		
		td {
			border: 1px dotted #000000;
			padding: 3px;
		}


		td:empty {
			/*display: none;*/
			height: 0;
		}

Wenn ich td:empty benutze, wird die gefüllte Zelle leider nach links rüber gerutscht, wenn ihr linker Nachbar leer ist. Das ist Mist.

Wie macht man es richtig™?

Spirituelle Grüße
Euer Robert

[tk]

Hallo Robert,

Wenn ich td:empty benutze, wird die gefüllte Zelle leider nach links rüber gerutscht, wenn ihr linker Nachbar leer ist. Das ist Mist.

Wie soll dass Ausblenden der leeren Zelle denn aussehen? Vielleicht reicht es wenn du bei leeren Zellen einfach den Rahmen entfernst?

Gruß,
Tobias

[robertroth]

Lieber Tobias, liebe Mitdenker, liebe Wissende, liebe Neugierige,

ja!

Wenn ich td:empty benutze, wird die gefüllte Zelle leider nach links rüber gerutscht, wenn ihr linker Nachbar leer ist. Das ist Mist.

Wie soll dass Ausblenden der leeren Zelle denn aussehen? Vielleicht reicht es wenn du bei leeren Zellen einfach den Rahmen entfernst?

Hab mich vielleicht noch etwas verquirxt ausgedrückt :-O

Also, es soll die Tabellenzeile ausgeblendet werden, wenn alle Zellen in ihr leer sind. Das funktioniert aber leider nur, wenn man den Zellen auch sagt, dass sie ausgeblendet werden sollen, wenn sie leer sind. Das wiederum führt aber dazu, dass gefüllte Zellen nach links aufrücken, wenn ihre linken Nachbarn leer sind. Die werden dann ja nicht angezeigt.

So jedenfalls in meinen Gehversuchen.

Die Daten stehen damit in einer falschen Spalte.

Ich habe es ersatzweise mit einer Höhenangabe versucht, aber bleibt noch ein Rest von der Zeile zurück.

Spirituelle Grüße
Euer Robert

[tk]

Hallo Robert,

Ich habe es ersatzweise mit einer Höhenangabe versucht, aber bleibt noch ein Rest von der Zeile zurück.

Die Höhenangabe alleine entfernen reicht nicht, du musst das padding der leeren Zeilen (und ggf. den Rahmen) auch noch mit entfernen, dann sollten Zeilen die nur leere Zellen enthalten ganz weg sein.

Gruß,
Tobias

[Gunnar Bittersmann]

Die Höhenangabe alleine entfernen reicht nicht, du musst das padding der leeren Zeilen (und ggf. den Rahmen) auch noch mit entfernen, dann sollten Zeilen die nur leere Zellen enthalten ganz weg sein.

Nicht ganz.

Außerdem verbietet sich das Entfernen des Rahmens, da der dann zwischen zwei benachbarten leeren Zellen in nicht ausgeblendeten Teilen fehlen würde.

LLAP

[Matthias Apsel]

Hallo robertroth,

		tr:empty {
			display: none;
		}	

Das kann nicht funktionieren, siehe wiki/empty

Wenn ich td:empty benutze, wird die gefüllte Zelle leider nach links rüber gerutscht, wenn ihr linker Nachbar leer ist. Das ist Mist.

Wie macht man es richtig™?

Mit CSS derzeit imho gar nicht, weil das auf ein Rückwärtsselektieren hinausläuft.

Bis demnächst

Matthias

[robertroth]

Liebe Mitdenker, liebe Wissende, liebe Neugierige,

ja!

Wenn ich td:empty benutze, wird die gefüllte Zelle leider nach links rüber gerutscht, wenn ihr linker Nachbar leer ist. Das ist Mist.

Wie macht man es richtig™?

Mit CSS derzeit imho gar nicht, weil das auf ein Rückwärtsselektieren hinausläuft.

Das Ausblenden funktioniert doch fast wunschgemäß, nur das Festtackern der gefüllten Zellen in ihren Spalten nicht. Die Tablerow merkt also durchaus, ob da noch Tabellenzellen kommen.

Spirituelle Grüße
Euer Robert

[Regina Schlaukrug]

  td:empty {
  	/*display: none;*/

Wenn ich td:empty benutze, wird die gefüllte Zelle leider nach links rüber gerutscht, wenn ihr linker Nachbar leer ist. Das ist Mist.

http://www.w3.org/TR/CSS21/visufx.html#propdef-visibility

[Gunnar Bittersmann]

Wie macht man es richtig™?

Richtig (ohne ™) beschreiben, was „es“ ist.

Was genau meinst du mit „ausblenden“/„nicht angezeigt werden“?

LLAP

[robertroth]

Liebe Mitdenker, liebe Wissende, liebe Neugierige,

ja!

Wie macht man es richtig™?

Richtig (ohne ™) beschreiben, was „es“ ist.

Was genau meinst du mit „ausblenden“/„nicht angezeigt werden“?

Was sonst? Wenn Du meinen Wunsch auf Chinesisch braucht, muss ich leider passen.

Spirituelle Grüße
Euer Robert

[Gunnar Bittersmann]

Was genau meinst du mit „ausblenden“/„nicht angezeigt werden“?

Was sonst? Wenn Du meinen Wunsch auf Chinesisch braucht, muss ich leider passen.

Verständliches Deutsch würde genügen.

Eine Zelle ausblenden heißt natürlich, dass nachfolgende Zellen nach links rücken. Das willst du nicht. Also: Was sonst?

LLAP

[robertroth]

Liebe Mitdenker, liebe Wissende, liebe Neugierige,

ja!

Was genau meinst du mit „ausblenden“/„nicht angezeigt werden“?

Was sonst? Wenn Du meinen Wunsch auf Chinesisch braucht, muss ich leider passen.

Verständliches Deutsch würde genügen.

Lesen des Threads auch!

Eine Zelle ausblenden heißt natürlich, dass nachfolgende Zellen nach links rücken. Das willst du nicht. Also: Was sonst?

Ich will die Tabellenzeile nicht anzeigen, wenn alle ihre Zellen leer sind. Aber das schrieb ich schon.

Spirituelle Grüße
Euer Robert

[Gunnar Bittersmann]

Ich will die Tabellenzeile nicht anzeigen, wenn alle ihre Zellen leer sind. Aber das schrieb ich schon.

Im Titel schriebst du „Zellen … ausblenden“; das hat mich verwirrt.

Du willst keine Zellen ausblenden, sondern ganze Zeilen.

Du willst tr:not(:has(> :not(:empty))) { visibility: collapse }. Demnächst™ in ihrem Browser.

Bis dahin: siehe tk.

LLAP

Selectors Level 4: :has

(Wie macht man denn jetzt Links in Code-Bereichen?)

[robertroth]

Liebe Mitdenker, liebe Wissende, liebe Neugierige,

ja!

Ich will die Tabellenzeile nicht anzeigen, wenn alle ihre Zellen leer sind. Aber das schrieb ich schon.

Im Titel schriebst du „Zellen … ausblenden“; das hat mich verwirrt.

Du willst keine Zellen ausblenden, sondern ganze Zeilen.

Du willst tr:not(:has(> :not(:empty))) { visibility: collapse }. Demnächst™ in ihrem Browser.

Na super! Dann warte ich solange. Das Internet ist hier heute sowieso etwas langsam ;-D

Selectors Level 4: :has

Spirituelle Grüße
Euer Robert