title: HTML/CSS Progess Bar shows on browser but doesnt show when trying to print the document
body: <p>Im helping a friend create a resume and wanted to incorporate a cool progress bar for the skills portion. </p>
  
  <p>I have created a progress bar and it displays on the browser completely fine; however, when I try to try to save the page as a PDF, the progress bar doesn't show, as in its just shows a white space. </p>
  
  <p>The code I have for the progress bar:</p>
  
  <pre><code>.w3-progress-container{
    width:90%;
    height:1.5em;
    position:relative;
    background-color:#f1f1f1;
    border-radius:7px;
    height:12px;
    margin-top: 5px;
    background-color: #d5d4d4;
  }
  .w3-progressbar{
    background-color: #0060A6;
    height:100%;
    position:absolute;
    line-height:inherit;
    border-radius:7px;
  }
  
  .management{
    width:93%;
  }
  </code></pre>
  
  <p><a href="https://jsfiddle.net/w8kaw4y1/" rel="nofollow">https://jsfiddle.net/w8kaw4y1/</a></p>
  
  <p>Any ideas on why its not rendering when I save it as a PDF ?</p>
  
  <p>Thanks!</p>