Hi @ll,
ich habe da mal ne Frage zum stylen von Tabellen. Die Tabelle ist als Content-Element Tabelle eingefügt. Im Quelltext schaut das dann so aus:
<table class="contenttable contenttable-0">
<tr class="tr-even tr-0">
<td class="td-0"><p> </p></td>
<td class="td-1"><p>Mo</p></td>
<td class="td-2"><p>Di</p></td>
<td class="td-3"><p>Mi</p></td>
<td class="td-4"><p>Do</p></td>
<td class="td-5"><p>Fr</p></td>
<td class="td-6"><p>Sa</p></td>
<td class="td-last"><p>So</p></td>
</tr>
to be continued ...
Was mich jetzt irritiert ist, dass ich für jede Zeile/Spalte ne eigene CSS Classe habe. Ich möchte aber nicht für jede Zeile/Spalte extra einen Eintrag in mein CSS File schreiben. Es sollte also eine Klasse geben, mit welcher ich meine komplette Tabelle gestalten kann.
Kann man sowas im Stylesheet machen, oder muss ich Typo3 beibringen andern Quelltext auszugeben?
Sascha
Problem gelöst, mann darf sich nur nicht auf selfhtml.org beschränken.
Man nehme folgenden CSS Code, dann klappts auch ohne Änderungen im Typoscript:
.contenttable td {
border:2px #000000 solid;
}
Das spricht alle td-Elemente innerhalb an, die sich innerhalb eines Elements der Klasse contenttable befinden. Mehr Infos in Google mit den Suchworten "CSS Vererbung".
Sascha
Hey leute,
habe ein ähnliches Problem mit dem Stylen von tabellen, wollte aber deswegen nicht extra ein neues Thema eröffnen.
Das man Tabellen in Typo3 mittels CSS Stylen kann ist ja nix neues.
Wie man auch hier sehen kann:
.tr-0 {
formatierungen für die erste Zeile
}
.tr-even {
formatierung für alle ungeraden Zeilen
}
.tr-odd {
formatierung für alle geraden Zeilen
}
.tr-even .td-0{
formatierung für die linke Spalte der ungeraden Zeilen
}
.tr-even .td-last {
formatierung für die rechte Spalte der ungeraden Zeilen
}
.tr-odd .td-0{
formatierung für die linke Spalte der geraden Zeilen
}
.tr-odd .td-last {
formatierung für die rechte Spalte der geraden Zeilen
}
.tr-last {
formatierung für die letzte Zeile
}
.contenttable {
allgemeine Formatierungen für alle Tabellen
}
.contenttable-1 {
allgemeine Formatierungen für die erste Tabelle der Seite
}
.contenttable-1 .tr-0 {
formatierungen für die erste Zeile der ersten Tabelle
}
.contenttable .tr-0 {
formatierungen für die erste Zeile aller Tabellen
}
Mein Problem jedoch ist es jetzt das sich zwischen den Zellen noch abstände befinden 🙁
Wie man auf folgenden Bild auch gut erkennen kann:
Bild: img91.imageshack.us/…/tabelle9cd.png
Ich habe auch schon etwas rumprobiert aber leider habe ich nix gefunden was die Abstände zwischen den Zellen verschwinden lässt. Eventuell kennt ja jemand die Lösung ?
Thx 4 Help !
auch schon probiert cellpadding und cellspacing auf 0 zu setzen?
Jo hab ich.
Aber leider bewirken sowohl:
.contenttable .tr-0 {
border: 0px;
cellpadding: 0px;
cellspacing: 0px;
}
als auch:
.contenttable {
border: 0px;
cellpadding: 0px;
cellspacing: 0px;
}
nix. :/
Probiers mal mit:
margin: 0px;
padding: 0px;
Es gibt nämlich keine CSS-Eigenschaften "cellpadding" und "cellspacing".
.contenttable .tr-0 {
background:#99CCFF;
margin: 0px;
padding: 0px;
}
.contenttable {
margin: 0px;
padding: 0px;
}
Danke für die freundliche hilfe aber leider gehts immer noch nicht. 🙁
Nein, leider bringt es auch nichts den Border auf "0" zu stellen.
Mhh komisch ... das muss doch irgentwie gehen? Hatt denn noch keiner solch ein Problem gehabt ? Ich benötige ja nur einen Blauen Tabellenkopf wie ist ja eigentlich egal wenn es auch anders geht so das dort keine Abstände sind lasst es mich wissen leute.
Thx!
Deine Frage wirst du aufjedenfall auf www.xhtmlforum.de beantwortet bekommen.
Danke für den Link, ONeill.
Doch ich will ja keine "normalen" Tabellen erstellen (das klappt übrigens wunderbar) sondern halt Typo3 Tabellen.
Und ich kann einfach nicht verstehen warum da ein Abstand ist. Obwohl ich border, padding und spacing auf "0" gesetzt habe. Gerne Poste ich auch meine komplette CSS Datei doch ich glaube nicht das es daran liegt ... ich habe auch schon mal im Netz nach lösungen gesucht doch manchmal wird mit typo-script gearbeitet manchmal mit CSS. Aber leider konnte ich noch keinen passenden Lösungsansatz finden. 😢
Plz Help.
@TheGeek
"Cellpadding" und "cellspacing" haben nichts in den CSS-Definitionen zu suchen. Es sind Attribute die in den TABLE-Tag kommen und dort Werte erhalten können im Stil von: cellpadding="0" cellspacing="0". Cellspacing betrifft den Abstand der Zellen untereinander. Cellpadding den Innenabstand in den Zellen.
Hoffentlich hilfts.
Hallo TheGeek,
hast Du schon mal 'border-collapse:collapse;' ausprobiert?
Grüße
Stephan
Hallo,
ich hänge mich hier mal ran 🙂
Wie spreche ich ein einzelne Zelle per CSS an?
Also tr-0 td-0 ...
Cu
Sammlerjaeger
@ TheGeek ich hab mich mir sowas auch mal
rumgeschlagen, schau mal in den generierten code
ob außer den im css bereits vereinbarten Klamotten
sonst noch was drin steht/reingewrapt wird.
Denn auch jedes andere Tag kann eine Lücke verursachen
dann ins css halt z.B.
table, ... {
spacing: 0px;
padding: 0px;
border: 0;
margin: 0px 0px 0px 0px;
}
sollte die Tabelle in irgendeiner Art und Weise img
verwenden kann u.U. auch :
td img {display: block;} o.ä. helfen
LG
Honk
@ sammlerjäger
.classenname {
padding: ..... ;
color: .....;
...
...
}
also für classenname jeweils die Klasse
eintragen, die du formatieren willst ...
zu beachten ist: liegt die Klasse z.B. in einem
div musst du u.U. beachten das sie dann über
#meineblabla DIV.class{.....} anzusprechen ist.
einfach mal anschauen wie und wo die im html
steht.
gute seite zum nachschlagen für weiter infos :
http://jendryschik.de/wsdev/einfuehrung/stichwortverzeichnis
LG
Honk
heyp !!
Bei mir hat folgendes geholfen
für Layout3
tt_content.table.20.tableParams_3.cellpadding = 0
tt_content.table.20.tableParams_3.cellspacing = 0
Bis dann
Asimock
stephan_bauer:<br />hast Du schon mal 'border-collapse:collapse;' ausprobiert?
Richtig, dies is imho die eleganteste (weil css) Lösung
.contenttable-3 {
border-collapse: collapse;
}