Tenho um script de um sistema legado que cria uma tabela com os dados vindo do banco em php. O script foi desenvolvido pra armazenar tudo numa tag $html e no final dar um echo.
Ao final desse script existe um elemento rodapé com lugar para o funcionário assinar. Cliente pediu pra que esse rodapé ficasse no final de toda página que for impressa.
Até aí tudo bem. Coloquei a div com o css abaixo:
div.footer {
position: fixed;
bottom: 0;
}
e a tabela com a seguinte configuração pra quebra de página se a "linha" ultrapassar o final da página:
table { page-break-inside:auto; margin-bottom: 10px; }
tr { page-break-inside:avoid; page-break-after:auto; }
thead { display:table-header-group }
tfoot { display:table-footer-group }
Tudo funciona de forma bacana a não ser pelo fato de o elemento rodapé sobrescrever a última linha da tabela em certas páginas onde a tabela pega toda a altura da página.
Teria alguma forma evitar isso? Tentei algumas formas com javascript e css mas como o número de elementos rodapé é um só, mesmo ele sendo impresso em 3, 4, 5 páginas, ainda não consegui.
<html>
<head>
<style type="text/css" media="print">
table { page-break-inside:auto; margin-bottom: 10px; }
tr { page-break-inside:avoid; page-break-after:auto; }
thead { display:table-header-group }
tfoot { display:table-footer-group }
div.footer {
position: fixed;
bottom: 0;
}
</style>
</head>
<body>
<table>
...
</table>
<div class='footer'>
<label style='font-family:verdana;font-size:10px;font-weight:bold;'>Assinatura: _______________________________________________<br>Por ser verdade, assino e dou fé ao presente documento</label>
<div id='pages' class='pages'></div>
</div>
</body>
</html>