Drucken einer HTML-Tabelle mit vielen Spalten / Zeilen im CSS-Layout?
Ich möchte eine große Tabelle (so groß, dass ihre Zeilen ca. 3 Blatt breit sind) aus HTML drucken. Wenn möglich, sollte CSS für das Layout ausreichen und die Lösung sollte mit verschiedenen Browsern funktionieren.
Ich definiere derzeit die folgenden Stilregeln:
table { page-break-inside:auto; }
tr { page-break-inside:auto; }
Wenn ich die DOM-Elemente inspiziere, z. in Firefox 33.0.2 (unter OS X) sehe ich, dass die Regeln erkannt werden, aber wenn ich mir dann eine Druckvorschau anschaue Date | Drucke | PDF | PDF in Vorschau öffnen) alle Spalten, die nicht auf die erste Seite passen, werden abgeschnitten, d. h. ich erhalte 1 Seite der gedruckten Ausgabe anstelle von 3. Ich habe auch Internet Explorer 11 und 10 mit dem gleichen Effekt versucht.
Wie kann ich große HTML-Tabellen (letztendlich sowohl spalten- als auch zeilenweise) für den Ausdruck mit CSS gestalten?
Bonus-Frage: Wenn Komponenten im Seitenumbruchstil tatsächlich nur für Elemente auf Blockebene gelten, wie in @ angegebDie vorherige Antwort, würde es helfen, wenn ich meine Tabelle aus @ konstruierdivs statttds wenn auf Druckausgabe abgezielt wird?
AKTUALISIERE
Hier ist ein relevantes Beispiel, das ich gerade auf JSFiddle ausprobiert habe. (Ich habe dort keinen Account, daher kann ich bei FWIK keinen direkten Link angeben.)
HTML:
<body>
<table>
<tr>
<td>The_quick_brown_fox_jumped_over_the_lazy_dog_A_0</td>
<td>The_quick_brown_fox_jumped_over_the_lazy_dog_A_1</td>
<td>The_quick_brown_fox_jumped_over_the_lazy_dog_A_2</td>
<td>The_quick_brown_fox_jumped_over_the_lazy_dog_A_3</td>
<td>The_quick_brown_fox_jumped_over_the_lazy_dog_A_4</td>
<td>The_quick_brown_fox_jumped_over_the_lazy_dog_A_5</td>
<td>The_quick_brown_fox_jumped_over_the_lazy_dog_A_6</td>
<td>The_quick_brown_fox_jumped_over_the_lazy_dog_A_7</td>
<td>The_quick_brown_fox_jumped_over_the_lazy_dog_A_8</td>
<td>The_quick_brown_fox_jumped_over_the_lazy_dog_A_9</td>
</tr>
</table>
</body>
CSS:
table { page-break-inside:auto; }
td { bor,der:1px solid lightgray; }
tr { page-break-inside:auto; }
Wenn ich versuche, diese Tabelle auszudrucken (z. B. durch Anwenden vonDieser Rahme | Print Frame ... | PDF | PDF in Vorschau öffnen zu JSFiddle'sErgebni view in Firefox 33.1 für OS X und für Papierformat / Ausrichtung A4 / Hochformat) Ich erhalte eine Ausgabeseite. Alle Spalten außer der ersten und einem Teil der zweiten werden abgeschnitten.