Unable to change the margin & layout for printing in chrome browser from angular 2

Unable to change the margin & layout for printing in chrome browser from angular 2

I'm trying to print HTML but I'm not able to change the&nbsp;<strong>layout</strong>&nbsp;and&nbsp;<strong>margin</strong>&nbsp;of the&nbsp;<strong>chrome browser</strong>(refer the attached image).

I'm trying to print HTML but I'm not able to change the layout and margin of the chrome browser(refer the attached image).

PRINT() {
  window.print();
}
@media print {
  .doNotPrint {
    display: none;
  }
  * {
    -webkit-print-color-adjust: exact;
  }
  @page {
    margin: 0 !important;
    size: A4 Landscape !important;
    -webkit-print-color-adjust: exact;
  }
  html,
  body {
    margin: 0 !important;
    size: A4 Landscape !important;
    -webkit-print-color-adjust: exact;
  }
}
<form [ngClass]="themeSRVC.currentThemeNAME" fxLayout="column" fxFlex>
  <!-- navBAR -->
  <mat-toolbar id="idPrimaryTOOLBAR" color="primary" class="doNotPrint">
    <mat-toolbar-row>
      <button mat-icon-button type="button" (click)="routeSRVC.goBACK()">
        <mat-icon matTooltip="Go Back">arrow_back</mat-icon>
      </button>
      <span class="fillSPACE"></span>
      <button mat-icon-button (click)="PRINT()">
        <mat-icon matTooltip="print">print</mat-icon>
      </button>
    </mat-toolbar-row>
  </mat-toolbar>

<!-- printableCONTENT --> <div id="idToPRINT" fxFlex>

&lt;div fxLayout="row"&gt;
  &lt;div fxFlex="33" style="height:200px;background-color:red"&gt;Left&lt;/div&gt;
  &lt;div fxFlex style="height:200px;background-color:yellow"&gt;Center&lt;/div&gt;
  &lt;div fxFlex="33" style="height:200px;background-color:green"&gt; Right&lt;/div&gt;
&lt;/div&gt;

</div>

</form>


Angular 9 Tutorial: Learn to Build a CRUD Angular App Quickly

What's new in Bootstrap 5 and when Bootstrap 5 release date?

Brave, Chrome, Firefox, Opera or Edge: Which is Better and Faster?

How to Build Progressive Web Apps (PWA) using Angular 9

What is new features in Javascript ES2020 ECMAScript 2020

8 Best Google Chrome Extensions for FULLSTACK DEVELOPERS

In this video, I have listed down the best chrome extensions that I use as a Fullstack Developer to increase my productivity

How to use Google Maps in Angular?

Learn the easiest way to use Google Maps in Angular

How to Install Google Chrome Web Browser on CentOS 8?

This tutorial explains how to install the Chrome Browser web browser on CentOS 8. Chrome is the most widely used web browser in the world.