Ich habe eine große HTML-Tabelle, die nicht geändert werden kann. Ich möchte nach jeder Zeile Seitenumbrüche einfügen, wenn die Ausrichtung Querformat ist nur.Chrome (v51) - Medienabfrage zum Einfügen von Seitenumbrüchen zwischen Tabellenzeilen - nur Querformat
Ich habe eine kleine Testseite erstellt, um eine Lösung zu finden.
Dieser Code funktioniert wie unter Firefox 46,0 erwartet, aber überhaupt nicht unter Chrome 51.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>CSS print media query test</title>
<style>
body {
font-family: arial,sans;
}
table {
margin: 0 auto;
}
table tr {
height: 500px;
vertical-align: top;
}
table td {
border: 1px solid #23ffff;
background-color: #edffff;
padding: 15px;
cell-spacing: 5px;
}
@media print and (orientation:landscape) {
table tr {
page-break-after: always !important;
}
}
</style>
</head>
<body>
<table>
<tr>
<td>$i is 1 and $j is 1</td>
<td>$i is 1 and $j is 2</td>
<td>$i is 1 and $j is 3</td>
<td>$i is 1 and $j is 4</td>
</tr>
<tr>
<td>$i is 2 and $j is 1</td>
<td>$i is 2 and $j is 2</td>
<td>$i is 2 and $j is 3</td>
<td>$i is 2 and $j is 4</td>
</tr>
<tr>
<td>$i is 3 and $j is 1</td>
<td>$i is 3 and $j is 2</td>
<td>$i is 3 and $j is 3</td>
<td>$i is 3 and $j is 4</td>
</tr>
<tr>
<td>$i is 4 and $j is 1</td>
<td>$i is 4 and $j is 2</td>
<td>$i is 4 and $j is 3</td>
<td>$i is 4 and $j is 4</td>
</tr>
</table>
</body>
</html>
Dies ist eine Testseite, ich normalerweise nicht die CSS in Tags setzen.