4

I use @media print {} to make some changes on print. But when I see the print preview in Google chrome it shows an extra blank page on the bottom. How to remove it ? I try some code for it but it still not working. 

div:last-child{
    page-break-after: auto !important;
}
body,html{
    height:auto !important;
    min-height:200px;
}
Ahsan Habib
  • 167
  • 2
  • 16

2 Answers2

6

Try use this method:

* {
  font-size: 1em !important;
  line-height: 1 !important;
}
Mentor-kh
  • 99
  • 1
  • 5
  • You saved my day. line-height: 1 !important; works like magic. – maruf571 Aug 26 '17 at 07:54
  • 1
    I don't know why this works, but it does.Setting line-height: 1 was the only thing that worked for me. For those who only want to do this while printing, it may be wise to stick this css in the @media print { } directive to avoid messing with other styles. – shell Feb 03 '19 at 21:23
0

From my side, it was because bootstrap was adding dummy styles there. I resetted them. See how it adds them.

enter image description here

So I resetted them:

enter image description here

Vugar Abdullayev
  • 1,852
  • 3
  • 21
  • 46