• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Formatierung der Tabelle funktioniert nicht

oulif

Neues Mitglied
Hallo,

ich verzweifle gerade an der Formatierung einer Tabelle und komme nicht auf den Fehler.
Nachdem die Schriftart im <thead> nicht fett ist, habe ich das ganze mal in <table> eingefügt mit roter Schrift. Das funktioniert.
Aber warum geht es im Header nicht?

Unten seht ihr als erstes den Auszug aus der Tabelle. Darunter dann den CSS-Code.

Bitte um Hilfe, wo ich den Fehler habe?

Danke
Anja

HTML:
<div class="berechnung">
    <table class="berechnung_formatierung">
    <thead>
        <tr class="tabellenkopf">
            <td>Datum<br/>des Einsatzes</td><td>Einsatzdauer</td><td>Fahrtzeit</td><td>Wartezeit</td><td>Fahrtweg<br/>Hin- und Rück</td><td>Zwischensumme</td>
        </tr>
    </thead>
    <tbody>
....

CSS:
.berechnung {
    font-size: 12px;
    color: black;
    font-weight: bold;
}

.berechnung_formatierung {
    vertical-align: bottom;
    text-align: left;
    color: black;
    font-weight: normal;
}

.tabellenkopf {
    font-size: 10px;
    font-weight: bold;
    color: red;
    padding: 2px;
}
 
Werbung:
Danke für den Tipp.
Im td-Element habe ich nichts drin, wo stören könnte.
Ich werde morgen mal die einzelnen Elemente deaktivieren und dann schauen, welches hier stört.
 
Den HTML-Inspektor kann ich leider nicht nutzen, da das ganze ein Rechnungsprogramm (Invoiceplane) ist, bei dem ich auf Basis einer php-Seite ein pdf erstelle. Deswegen das ganze mit dem deaktivieren. Wobei das nichts nutzt. :(

Sobald ich in der Klasse von <thead> was änder, wird es nicht übernommen. So als ob diese gar nicht existiert.
Änder ich z.B. in der Klasse von <table> die Schrift auf rot, so wird der Inhalt der Tabelle und zwar der in <body> steht rot. Das was in <thead> steht, bleibt schwarz.
Das ist wie verhext.... :eek:
 
Werbung:
Grundsätzlich werden im "thead" auch "th" Elemente verwendet, keine "td".
Wird das Problem aber vermutlich auch nicht lösen.
 
Das hab ich schon geändert, dass th-Elemente verwendet werden.
Jein. Das ganze läuft bei mir auf einem W2k16-Webserver. Wenn ich die einzelnen Posten im Browser eingegeben habe, kann ich daraus ein pdf generieren, das standardmäßig im Browser bei mir geöffnet wird und kann dieses weiterverarbeiten. Falls zum besseren Verständnis hilfreich, hat der Hersteller eine Demo-Instanz installiert: https://invoiceplane.com/demo

Ich denke ich habe den Fehler jetzt gefunden.
In <td> hatte ich nur zwei paddings (right und left) eingetragen. In <thead> hatte ich ursprünglich class="tabellenkopf". Das hatte ich dann testweise mal runter in <tr> reingeschrieben. Warum das ganze nicht gezogen hat, kann ich leider nicht sagen.
Jetzt habe ich in der CSS bei th color: bold; eingetragen und schon funktioniert es.

Ganz schlau bin ich aber daraus nicht geworden.
Ich bin davon ausgegangen, dass wenn ich in den allgemeinen Elementen wie <tr>, <td>, <p>, ... Standardwerte vorgebe, die über das ganze Blatt gelten sollen und dann mit Klassen und IDs das nochmals genauer spezifizier, dass das so übernommen wird. Oder denk ich da falsch?

Auszug aus meiner CSS:

CSS:
main {
    font-size: 12px;
    font-family: Georgia, serif;
    color: black;
    font-weight: normal;
    
td {
    padding-right: 10px;
    padding-left: 10px;
}

th {
    font-size: 12px;
    font-family: Georgia, serif;
    color: black;
    font-weight: normal;
    text-align: left;
}
//wird in <thead> verwendet   
.tabellenkopf {
    font-size:12px;
    text-align: left;
    font-weight: bold;
    color: red;
    padding: 5px;
}
 
Das hab ich schon geändert, dass th-Elemente verwendet werden.
Jein. Das ganze läuft bei mir auf einem W2k16-Webserver. Wenn ich die einzelnen Posten im Browser eingegeben habe, kann ich daraus ein pdf generieren, das standardmäßig im Browser bei mir geöffnet wird und kann dieses weiterverarbeiten. Falls zum besseren Verständnis hilfreich, hat der Hersteller eine Demo-Instanz installiert: https://invoiceplane.com/demo

Ich denke ich habe den Fehler jetzt gefunden.
In <td> hatte ich nur zwei paddings (right und left) eingetragen. In <thead> hatte ich ursprünglich class="tabellenkopf". Das hatte ich dann testweise mal runter in <tr> reingeschrieben. Warum das ganze nicht gezogen hat, kann ich leider nicht sagen.
Jetzt habe ich in der CSS bei th color: bold; eingetragen und schon funktioniert es.

Ganz schlau bin ich aber daraus nicht geworden.
Ich bin davon ausgegangen, dass wenn ich in den allgemeinen Elementen wie <tr>, <td>, <p>, ... Standardwerte vorgebe, die über das ganze Blatt gelten sollen und dann mit Klassen und IDs das nochmals genauer spezifizier, dass das so übernommen wird. Oder denk ich da falsch?

Auszug aus meiner CSS:

CSS:
main {
    font-size: 12px;
    font-family: Georgia, serif;
    color: black;
    font-weight: normal;
   
td {
    padding-right: 10px;
    padding-left: 10px;
}

th {
    font-size: 12px;
    font-family: Georgia, serif;
    color: black;
    font-weight: normal;
    text-align: left;
}
//wird in <thead> verwendet  
.tabellenkopf {
    font-size:12px;
    text-align: left;
    font-weight: bold;
    color: red;
    padding: 5px;
}

Im allgemeinen hast du das schon richtig verstanden.
Trotzdem sollte gemäß CSS "th" die Farbe "black" haben.

Verwende mal ordentliche HEX-Farbcodes (#FF0000) statt "red".
Möglich dass der PDF-Generator nichts mit diesen Werten anfangen kann.
 
Werbung:
Zurück
Oben