page break css for printing html page content not working in chrome

Question

I tried

@media print {
            html, body {
                height:100%;
                margin: 0 !important;
                padding: 0 !important;
                overflow: hidden;
            }
            .page-break {
                overflow: hidden;
                page-break-after: always !important;
            }
}

in html I put a div after a table of content; and before another table of content with print.

<div class="page-break"></div>

This is working perfectly by separating the contents in Firefox, but in chrome all the contents are displayed in a single page for the .