Zum Inhalt springen

Tabellen mit CSS aber nur Content

Erstellt am 6. Mai 2008 · 13 Antworten · letzte Antwort am 7. Mai 2008

Tags: HTML & CSS, Frage

Unbekannter Benutzer ·

In dem du einen entsprechenden Selector benutzt...

Also z.B. dein Content ist in einem DIV mit id="content",

#content table{

}

definiert CSS nur für Tabellen innerhalb des DIVs. Darüber kannst du das gut einschränken. Normalerweise bekommen die Tabellen aus dem RTE auch eine Standard-Class, darüber ginge es auch.

Grüße
Christian

leibnitz ·

steh grad irgendwie auf dem schlauch, mein CSS sieht bis jetzt so aus:

table, th, td {
	border: 1px solid #D4E0EE;
	border-collapse: collapse;
	font-family: "Trebuchet MS", Arial, sans-serif;
	color: #555;
}
caption {
	font-size: 150%;
	font-weight: bold;
	margin: 5px;
}
td, th {
	padding: 4px;
}
thead th {
	text-align: center;
	background: #E6EDF5;
	color: #4F76A3;
	font-size: 100% !important;
}
tbody th {
	font-weight: bold;
}
tbody tr { background: #FCFDFE; }
tbody tr.odd { background: #F7F9FC; }
table a:link {
	color: #718ABE;
	text-decoration: none;
}
table a:visited {
	color: #718ABE;
	text-decoration: none;
}
table a:hover {
	color: #718ABE;
	text-decoration: underline !important;
}
tfoot th, tfoot td {
	font-size: 85%;
}
leibnitz ·

also im html template siehts so aus

<div id="content" > ###content### </div>

wenn ich allerdings alles folgender maßen anpasse funktioniert es leider nicht

#content table, th, td {
	border: 1px solid #D4E0EE;
	border-collapse: collapse;
	font-family: "Trebuchet MS", Arial, sans-serif;
	color: #555;
}
#content caption {
	font-size: 150%;
	font-weight: bold;
	margin: 5px;
}
#content td, th {
	padding: 4px;
}
#content thead th {
	text-align: center;
	background: #E6EDF5;
	color: #4F76A3;
	font-size: 100% !important;
}
#content tbody th {
	font-weight: bold;
}
#content tbody tr { background: #FCFDFE; }
#content tbody tr.odd { background: #F7F9FC; }
#content table a:link {
	color: #718ABE;
	text-decoration: none;
}
#content table a:visited {
	color: #718ABE;
	text-decoration: none;
}
#content table a:hover {
	color: #718ABE;
	text-decoration: underline !important;
}
#content tfoot th, tfoot td {
	font-size: 85%;
}

genauso sollten die zeilen jeweils unterschiedliche farben haben also einmal heller und die nächste dunkler, da passt auch irgendwas noch net :-(

ich verzweifle noch.

mfg leibnitz

just2b ·

Statt
#content table, th, td {
gehörts auch
#content table, #content th, #content td {

das ist aber alles rein CSS-Wissen, mit TYPO3 hat das nichts zu tun

georg

leibnitz ·

ja stimmt, da hast du recht, jetzt funktionierts auch.
sitz glaub ich schon zu lange vor der kiste :-)

leider funktioniert das noch nicht mit den unterschiedichen farben pro zeile.
dazu vllt. noch einen kurzen tipp?

dann is gut für heute, nacht drüber schlafen dann gehts wieder.

mfg

just2b ·

ohne die seite zu kennen wirds schwer. installier dir addon firebug, dann sollts schnell zu finden sein

georg

leibnitz ·

habs jetzt mal installiert, werd mir das mal noch anschauen, kenn mich mit dem tool noch nicht aus.

kann die seite leider nicht online stellen ist nurimm intranet ferfügbar.

danke!

leibnitz ·

so hab mir das ganze mal mit firebug angeschaut und versucht was rauszufinden, allerdings bringt mich das irgendwie nicht weiter :-(

leibnitz ·

hab mir jetzt nochmal alles genau durchgeschaut.

ich komm nicht weiter, könnt ihr mir nicht helfen?

hiermal das html:

<tbody><tr><td colspan="2" rowspan="1" style="vertical-align: top;"><p class="bodytext"><br>Preisbestandteile</p></td><td><p class="bodytext"> 	 	Einheit</p></td><td><p class="bodytext">netto ohne USt.</p></td><td><p class="bodytext">brutto inkl. 7% USt.</p></td></tr><tr><td style="vertical-align: top;"><p class="bodytext">1.</p></td><td><p class="bodytext">Verbrauchspreis</p></td><td><p class="bodytext">EUR/m<sup>3</sup></p></td><td><p class="bodytext"> 	  1,07</p></td><td><p class="bodytext"><strong>1,14</strong></p></td></tr><tr><td style="vertical-align: top;"><p class="bodytext">2.</p></td><td><p class="bodytext">Grundpreis für Wasserzähler<br>mit Nenndurchfluss</p></td><td></td><td></td><td></td></tr><tr><td style="vertical-align: top;"></td><td><p class="bodytext">bis Qn 2,5</p></td><td><p class="bodytext">EUR/Monat</p></td><td><p class="bodytext"> 	  1,41</p></td><td><p class="bodytext"><strong>1,51</strong></p></td></tr><tr><td style="vertical-align: top;"></td><td><p class="bodytext">bis Qn 6</p></td><td><p class="bodytext">EUR/Monat</p></td><td><p class="bodytext"> 	  2,81</p></td><td><p class="bodytext"><strong>3,01</strong></p></td></tr><tr><td style="vertical-align: top;"></td><td><p class="bodytext">bis Qn 10</p></td><td><p class="bodytext">EUR/Monat</p></td><td><p class="bodytext"> 	  5,63</p></td><td><p class="bodytext"><strong>6,02</strong></p></td></tr><tr><td style="vertical-align: top;"></td><td><p class="bodytext">bis Qn 15</p></td><td><p class="bodytext">EUR/Monat</p></td><td><p class="bodytext"> 	  14,62</p></td><td><p class="bodytext"><strong>15,64</strong></p></td></tr><tr><td style="vertical-align: top;"></td><td><p class="bodytext">bis Qn 40</p></td><td><p class="bodytext">EUR/Monat</p></td><td><p class="bodytext"> 	  20,25</p></td><td><p class="bodytext"><strong>21,67</strong></p></td></tr><tr><td style="vertical-align: top;"></td><td><p class="bodytext">bis Qn 60</p></td><td><p class="bodytext">EUR/Monat</p></td><td><p class="bodytext"> 	  29,81</p></td><td><p class="bodytext"><strong>31,90</strong></p></td></tr><tr><td style="vertical-align: top;"></td><td><p class="bodytext">bis Qn 150</p></td><td><p class="bodytext">EUR/Monat</p></td><td><p class="bodytext"> 	  44,99</p></td><td><p class="bodytext"><strong>48,14</strong></p></td></tr></tbody>

was mach ich falsch?

mfg leibnitz

just2b ·

lad das ganze als dummyfile auf nen server, aber ich quäl mich sicher nicht mit einer html-wurst in 1 Zeile und einem CSS von dem ich nicht weiß wie es ausschaut, sorry

georg

leibnitz ·

Sorry

hier mal ne HTML Datei wies momentan aussieht:

http://leibnitz.piranho.de/index.php.htm

Allerdings soll immer jede zeile ne andere hintergrundfarbe haben, also
zeile 1 -> farbe 1
zeile 2 -> farbe 2
zeile 3 -> farbe 1
zeile 4 -> farbe 2

Das bisherige CSS ist auf Seite 1.
Ich weiß nicht mehr weiter, bitte helft mir. :-)

mfg leibnitz