'CSS Print Issue in iOS devices

Desktop (windows and Mac are showing correct print preview but iOS devices are not showing full width and some blank space above too.

Problem is I don't have any option to debug this in Browserstack. I can debug only in desktop rendering option.

This is my code:

@media print {
  body {
    -webkit-print-color-adjust: exact;
    width: 100%;
    max-width: 100% !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
    margin: 0 auto !important;
  }
  .cssr-print {
    display: block;
    visibility: visible;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    background-color: @white;
    padding: 50px 0 0;
    max-width: 100%;
    text-align: center;
    width: 100%;
  }
}
<div class='cssr-print'>
  .....
</div>

iPhone

Desktop



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source