title: How to use Print Styles in an Angular 7 App
body: <p>I need to print a html form (within an Angular7 App) with minimal margins. The only way thus far I can achieve this is to use Chrome and to adjust the margins manually via the print preview box.</p>
  
  <p>I have tried adding @media print styles &amp; @page styles in both the component css file and the main global stylesheet. I even tried changing the background colour of the html and body tags to green just to see if something was happening. I have changed the rendering in Chrome to print styles so I can see the affects of the CSS, yet still no affect is visible</p>
  
  <p>Tried in both component.css and styles.css</p>
  
  <pre><code>@page {
      size: auto;
      margin: 0;
  }
  
  html, body {
      margin: 0;
      background: green;
  }
  
  @media print{
      html, body {
          margin: 0;
          background: green;
      }
  }
  </code></pre>
  
  <p>The background green is just so I can see if it works. I will remove when I get it working.</p>
  
  <p>I expect to see the background to go green on the html and body tags when I render to the screen the print styles (or in the print-preview window)</p>
  
  <p>I get no green colour change to the html or body tags and the margins stay at the default amounts.</p>