htmlcssprinting

How to create page breaks automatically in CSS?


I create a web page with table rows. It is looking good when i press print button. But sometimes page breaks are cutting page middle of the block. I tried to use tbody as this

<table>
...
<tbody>
<tr><td>sample datea 1</td></tr>
<tr><td>sample datea 2</td></tr>
<tr><td>sample datea 3</td></tr>
</tbody>
<tbody>...</tbody>
...
</table>

When i want to print page it writes as

//first page  
sample datea 1 
sample datea 2 
// second page
sample datea 3 

I want to cut after sample datea 3 . I tried to add blokla's div tag CSS as

.blokla{display:block;page-break-inside:avoid; page-break-after:auto}

How can i break page between div tags or another ? My main problem is below.

enter image description here


Solution

  • I solved this question with this code

    tbody{page-break-inside:avoid; page-break-after:auto; position:relative;
    display:block;}
    

    It is working fine.