Test Table footer for print

HTML

<div>
  <table class="table-blue">
    <tr>
      <td>one</td>
      <td>one test</td>
    </tr>
    <tr>
      <td>two</td>
      <td>two test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
    </tr>
    <tr>
      <td>three</td>
      <td>three test</td>
...

CSS

div {
      position: relative;
      min-height: 500px;
      padding-bottom: 100px;
    }
    
    .table-blue {
      width: 100%;
      background: lightblue;
    }
    
    .table-blue td {
      padding: 5px 10px;
    }
    
    .table-blue-fotter {
      position: absolute;
      bottom: 0px;
      left: 0px;
      width: 100%;
      background: gray;
    }
    
    @media print {
  .table-blue-fotter {
    position: static; // Key line
    bottom: 20px;
    left: 0px;
    width: 100%;
    background: gray;
  }