title: CSS @page rule: How to preview in Internet Explorer
body: <p>IE seems to be the only web browser supporting page margin boxes (see <a href="https://msdn.microsoft.com/en-us/library/ie/ms530841(v=vs.85).aspx" rel="nofollow">here</a>). I have tested my CSS with WeasyPrint and it seems to be working fine. My question is: How do I actually see the @page rule being applied in IE? I currently use IE11. I can see the @media print rule being applied on Print Preview, however, the @page rule doesn't seem to be applied (and I am not nesting the @page rule inside the @media print rule). Can somebody please shed some light onto how the print preview with applied @page rule can be initiated?</p>
  
  <p>Here is how my page rule looks like:</p>
  
  <pre><code>@page {
  
  size: A4 portrait;
  margin: 1.5cm 1.5cm 1.5cm 1.5cm; 
  
  @top-left-corner {
      content: ""; /* has to be specified! */
      background-color: rgba(42, 201, 80, 0.220);
      border-bottom: solid green; 
  }
  
  @top-left {
      width: 70%;
      content: "";
      background: url('images/logo_v4.png'), rgba(42, 201, 80, 0.220);
      background-repeat: no-repeat, repeat;
      background-position: left center, left;
      background-size: contain; /* 5cm, cover or 100%: scale bg image, retains img ratio */ 
      border-bottom: solid green;
  } 
  
  @top-right {
      width: 30%;
      content: "Page " counter(page) " of " counter(pages);
      vertical-align: middle; 
      font-family: sans-serif;
      font-weight: bold;
      font-size: 0.7cm;
      color: white;
      text-align: center;
      background-color: #53c963;
      border-bottom: solid green;
      }
  
  @top-right-corner { 
      content: " "; 
      background-color: rgba(42, 201, 80, 0.220);
      /* background-color: #79caff; */
      border-bottom: solid green; 
  }
  
  @bottom-center {
      width: 100%;
      content: "Reporting Powered by Open Source Software";
      vertical-align: middle; 
      font-family: sans-serif;
      font-weight: bold;
      font-size: 0.7cm;
      color: green;
  }
  </code></pre>
  
  <p>}</p>