Коротко: есть ли способ напечатать одинаково выглядящие шаблоны из IOS и Android?Или, по крайней мере, есть способ напечатать HTML-таблицы в WebKit с правильными разрывами страниц?
Long: Мое приложение должно иметь возможность распечатывать список содержимого,Моей первой попыткой было использовать html для создания шаблона, а затем вставить содержимое из кода.Система работает, но когда таблица выходит за пределы одной страницы, WebKit полностью уничтожает таблицу.Я знаю, что на SO есть несколько вопросов о разрыве страниц в WebKit, но ни одно из решений не работает.
На этом изображении показана печать с использованием Chrome.Как видите, страницы хорошо разрываются.
Это изображение показывает то же самое в Safari.Разрыв страницы полностью разрушает таблицу: 
Мой код выглядит следующим образом:
<!DOCTYPE html>
<html>
<head>
<style>
tr {
page-break-inside: avoid;
page-break-before: auto;
page-break-after: auto;
width: 100%;
}
html,
body {
font-family: "Trebuchet MS", Helvetica, sans-serif;
padding: 0;
margin: 0;
width: 100%;
}
table {
border-collapse: collapse;
width: 100%;
table-layout: fixed;
page-break-after: auto;
}
th,
td {
border: 0.5px solid black;
border-collapse: collapse;
page-break-after: auto;
}
th {
width: 30%;
}
th+th {
width: 40%;
text-align: center;
}
th+th+th {
width: 15%;
}
th+th+th+th {
width: 15%;
}
td+td {
text-align: center;
}
td+td+td {
text-align: right
}
h1 {
margin-bottom: 0.2cm;
}
hr {
background-color: #000000;
height: 1cm;
float: left;
}
</style>
<script src="https://cdn.jsdelivr.net/npm/jsbarcode@3.11.0/dist/barcodes/JsBarcode.ean-upc.min.js"></script>
</head>
<body>
<div style="clear: both">
<h1 style="float: left">Materialentnahmeliste</h1>
<h1 style="float: right">1805/156</h1>
</div>
<table>
<thead>
<tr>
<th>Artikel</th>
<th>EAN</th>
<th>Menge</th>
<th>Verbr.</th>
</tr>
</thead>
<script>
const barcodes = [5413184160722, 4012615997145, 4004631016214, 5413184160593, 5413184160616, 5413184160654, 5413184160692, 4004631009315, 4004631047096, 4004631010977, 4210201175469, 5413184151492, 4004631062198, 4004631009476, 4004631011660, 4002515500361, 4012615996636, 4242002957005, 5413184104139, 5413184104047, 5413184170301, 4004631006567, 4002515824481, 4002515824528, 4002515942420, 5413184160968, 4004631000749, 4016803170921, 4016803174820, 4016803178187, 3121040039830, 5413184160081, 4002515932773, 4016803171263, 4016803037330, 4002515824177, 5413184122935, 4001797672001].map(String)
barcodes.forEach(barcode => {
document.write(`
<tr>
<td>${barcode}</td>
<td><svg id="b${barcode}"></svg></td>
<td>10000m</td>
<td>tet</td>
</tr>
`)
})
</script>
</table>
<p style="text-align:left;">
Ausgegeben von:
<span style="float:right;">Nov 25, 2018 at 3:00 PM</span>
</p>
<hr style="border: none">
<script>
barcodes.forEach(barcode => {
JsBarcode("#b" + barcode, barcode, {
format: "EAN13",
height: 25,
width: 2,
flat: true,
displayValue: true,
margin: 2
});
})
</script>
</body>
</html>