CSS media prints 3 blank pages - css

Question

I use Bootstrap 3, just to know. I cannot get rid of 3 blank pages after the first one. Don t know what is causing this problem.
HTML:
<table class="table table-bordered table-hover text-center" id="post_accesorii">
<thead>
<tr>
<th>Cod</th>
<th>Denumire</th>
<th>Cantitate</th>
<th>U.M.</th>
</tr>
</thead>
<tbody>
<form method="post" action="" autocomplete="off">
<?php
while($rowD = mysqli_fetch_assoc($query)) {
foreach ($rowD as $col => $val) {
if($val != "" && $val != "0" && $col != "nr_fisa" && $col != "id") {
$findum = mysqli_query($mysqli, "SELECT * FROM `stocuri` WHERE `cod` = '$col' AND `post1` = 'Accesorii'") or die(mysqli_error($mysqli));
$rowum = mysqli_fetch_array($findum);
echo "<tr class='piesa_folosita'>";
if($col == $rowum['cod'])
{
echo "<td>" . $col . "</td>";
echo "<td>" . $rowum['denumire'] . "</td>";
echo "<td>" . $val . "</td>";
echo "<td>" . $rowum['um'] . "</td>";
}
echo "</tr>";
} else {
}
}
}
?>
</tbody>
<tfoot>
<tr>
<th>Cod</th>
<th>Denumire</th>
<th>Cantitate</th>
<th>U.M.</th>
<tr>
</tfoot>
</table>
PRINT
print.css:
#media print {
html, body {
visibility: hidden;
height: 99% !important;
}
#post_accesorii, #post_accesorii * {
visibility: visible;
height: 99% !important;
}
#post_accesorii+#post_accesorii {
page-break-before: always;
}
}
In print preview, I have 3 blank pages after the first page with my table. I tried several solutions to remove them but none worked.
What can be the problem?

Answer 1

Your height: 99% !important; might be the problem, because the <body/> does not have parent

Answer 2

Your last print rule implies that there is more than one element that has the ID #post_accesorii . This should not be the case and is invalid HTML: IDs must only appear once in a page. So maybe that's the reason for your problems (I don't know what is around the code you posted, so that's all I can say).
To avoid that, make it a class instead of an ID: .post_accesorii and assign that to the HTML table tag/s via <table class="post_accesorii">