nicht angemeldet
Gunnar Bittersmann
Gunnar Bittersmann
Gunnar Bittersmann
Gunnar Bittersmann
MudGuard
Hallo,
ich habe eine Tabelle in der Daten dargestellt werden die aus einer DB ausgelesen werden.
Jede Tabellen-Zeile besteht aus 10 Tabellenzellen.
Die Tabellenzellen sollen unterschiedlich formatiert werden.
Ich könnte jede Zelle mit einer unterschiedlichen css-Klasse "<td class="td1">xxx</td>" formatieren. Dadurch, z.B. bei 500 Zeilen vergrössert sich dann aber der Quelltext.
Ich könnte natürlich nur z.B. 100 Zeilen anzeigen und dann Blättern. Das soll aber nicht.
Daher meine folgende Idee um Quelltext zu sparen:
Kann ich per css die einzelnen Tabellen-Zellen einer Zeile in der Reihenfolge des Auftretens ansprechen?
Danke für Eure Tipps und Meinungen im vorraus,
SpongeBob
Hello out there!
Kann ich per css die einzelnen Tabellen-Zellen einer Zeile in der Reihenfolge des Auftretens ansprechen?
Ja: http://forum.de.selfhtml.org/archiv/2006/6/t131723/#m852137
See ya up the road,
Gunnar
Moin!
Kann ich per css die einzelnen Tabellen-Zellen einer Zeile in der Reihenfolge des Auftretens ansprechen?
Ja: http://forum.de.selfhtml.org/archiv/2006/6/t131723/#m852137
Nein, da bin ich anderer Ansicht.
Das angewandte Beispiel nutzt zur Erzielung des Effekts Sonderszenarien des genannten Beispieles aus.
Eine allgemeine Lösung im Sinne von
td:4th-child { ... }
für das Ansprechen der vierten Zelle existiert im derzeitigen CSS-Standard nicht.
Mich würde daher interessieren, wie du in einer simplen, nur aus <td> bestehenden Tabelle, für alle Browser die vierte Spalte ansprechen willst.
- Sven Rautenberg
Hi,
td:4th-child { ... }
Du meinst `td:nth-child(4)`{:.language-css}. Siehe <http://www.w3.org/TR/css3-selectors/#nth-child-pseudo>
cu,
Andreas
--
[Warum nennt sich Andreas hier MudGuard?](http://MudGuard.de/)
[Schreinerei Waechter](http://www.schreinerei-waechter.de/)
[O o ostern ...](http://ostereier.andreas-waechter.de/)
Fachfragen unaufgefordert per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
Hello out there!
Das angewandte Beispiel nutzt zur Erzielung des Effekts Sonderszenarien des genannten Beispieles aus.
??
Eine allgemeine Lösung im Sinne von
td:4th-child { ... }
für das Ansprechen der vierten Zelle existiert im derzeitigen CSS-Standard nicht.
In CSS 3 schon; hieße dann :nth-child(4)
Mich würde daher interessieren, wie du in einer simplen, nur aus <td> bestehenden Tabelle, […]
Was heißt „nur aus <td> bestehend“? Zumindest tr dürften mit in Spiel sein.
Man kann CSS natürlich nur auf vorhandenes MArkup anwenden. Und was spricht dagegen, die Spalten mit dem dafür vorgesehenen Element col auszuzeichnen?
[…] für alle Browser die vierte Spalte ansprechen willst.
Wie im verlinkten Posting ganz unten.
See ya up the road,
Gunnar
Hallo,
danke für Deine Tipp.
Genutzt hat es aber nichts.
In meiner Tabelle habe ich COLS mit <col> definiert und diesen eine ID gegeben. Was ich dann perr css machen konnte war nur die Breite festzulegen, nicht aber Hintergrundfarben und Textformatierung.
Gruss,
SpongeBob
Hello out there!
In meiner Tabelle habe ich COLS mit <col> definiert und diesen eine ID gegeben. Was ich dann perr css machen konnte war nur die Breite festzulegen, nicht aber Hintergrundfarben und Textformatierung.
Funktioniert wunderbar im IE. Das es im FF so nicht geht, dafür aber anders, habe ich in http://forum.de.selfhtml.org/archiv/2006/6/t131723/#m852137 auch schon gesagt. Du hattest das Posting aufmerksam bis zum Ende gelesen?
See ya up the road,
Gunnar
Hi,
Du hattest das Posting aufmerksam bis zum Ende gelesen?
Ja, hatte ich.
Mit "th:first-child+th, th:first-child+td {display: none}" für den Firefox kann ich aber nichts anfangen.
Dieses bezieht sich ja auf das erste Element nach TH in einer Reihe.
Ich habe aber 10 TDs in einer Reihe, die ich unterschiedlich ansprechen möchte. da komme ich mit first-child nicht weit, oder sehe ich das falsch?
Grüße SpongeBob
Hello out there!
Mit "th:first-child+th, th:first-child+td {display: none}" für den Firefox kann ich aber nichts anfangen.
Dieses bezieht sich ja auf das erste Element nach TH in einer Reihe.Ich habe aber 10 TDs in einer Reihe, die ich unterschiedlich ansprechen möchte. da komme ich mit first-child nicht weit, oder sehe ich das falsch?
Ja. Du schaffst es, die Selektoren deinen Bedürfnissen entsprechend zu verändern?
Mit td:first-child selektierst du die erste Zelle jeder Zeile, mit td:first-child+td die zweite ... [CSS2 §5.7]
See ya up the road,
Gunnar
Hallo,
Ja. Du schaffst es, die Selektoren deinen Bedürfnissen entsprechend zu verändern?
Ja, das habe ich geschafft.
Und zwar so:
.resultTable #col5, .resultTable tr td:first-child+td+td+td+td
{
text-align:center;
background-color:#990000;
}
Im FF funzt es so, im IE nur wenn ich ".resultTable tr td:first-child+td+td+td+td" weglasse.
Was ja nicht Deinem genannten Beispiel
#col1, th:first-child+th, th:first-child+td {display: none}
enspricht.
Demnach muss man wohl eine Browserweiche einbauen müssen.
Gruß,
SpongeBob
Hello out there!
.resultTable #col5, .resultTable tr td:first-child+td+td+td+td
{
text-align:center;
background-color:#990000;
}Im FF funzt es so, im IE nur wenn ich ".resultTable tr td:first-child+td+td+td+td" weglasse.
Hm, der IE 6 ist wirklich zu bescheuert. Kennt einen Selektor nicht, aber anstatt ihn zu ignorieren, ignoriert er die ganze Regel.
Wenn du das trennst, geht’s:
.resultTable #col5
{
text-align:center;
background-color:#990000;
}
.resultTable tr td:first-child+td+td+td+td
{
text-align:center;
background-color:#990000;
}
See ya up the road,
Gunnar
Hi,
Hm, der IE 6 ist wirklich zu bescheuert. Kennt einen Selektor nicht, aber anstatt ihn zu ignorieren, ignoriert er die ganze Regel.
Naja, in Zusammenhang mit http://www.w3.org/TR/CSS21/syndata.html#q10 ist das eigentlich gar nicht so unlogisch.
Der Selektor ist zwar korrekt, wird vom IE aber nicht erkannt, also vom IE als fehlerhaft behandelt.
Bei einem fehlerhaften Selector ist das ganze Ruleset zu ignorieren - das gilt auch bei mehreren kommagetrennten Selektoren für ein Ruleset.
cu,
Andreas
Hallo,
Hm, der IE 6 ist wirklich zu bescheuert. Kennt einen Selektor nicht, aber anstatt ihn zu ignorieren, ignoriert er die ganze Regel.
Wenn du das trennst, geht’s:
.resultTable #col5
{
text-align:center;
background-color:#990000;
}
.resultTable tr td:first-child+td+td+td+td
{
text-align:center;
background-color:#990000;
}
Danke, so funktioniert es.
Was mich aber stört ist, dass ich es folgendermassen schreiben muss:
~~~css
.resultTable td:first-child+td+td+td+td, .resultTable td:first-child+td+td+td+td+td, .resultTable td:first-child+td+td+td+td+td+td,
.resultTable td:first-child+td+td+td+td+td+td+td
{
text-align:center;
}
das bläht den code ja auch wieder unnötig auf.
Grüße,
SpongeBob
Hallo SpongeBob.
Was mich aber stört ist, dass ich es folgendermassen schreiben muss:
[…]
das bläht den code ja auch wieder unnötig auf.
Aber wenigstens nicht den HTML-Code.
Und genau wegen solcher Konstrukte wurde ja die :nth-child(n)-Pseudoklasse mit CSS Level 3 eingeführt.
Einen schönen Freitag noch.
Gruß, Ashura