css разрыв страницы не работает с большими таблицами, когда переполнение настроено на прокрутку

Question

У нас возникают трудности при работе с большими таблицами при разрыве страницы, когда переполнение настроено на прокрутку,

    @media screen {
    #reportSection {
      overflow:scroll;
      height:500px !important;
     }
    }

    @media print {
    #reportSection {
     overflow:visible !important;
     height: auto !important;
     display: inline !important;
     }
    .page-break {
     page-break-before: always;
    }
    .no-print, .no-print * {
     display: none !important;
    }
    }

    <div id="reportSection" class="showSection" style="float: none;"><p id="headstatic"  style="font-weight: bold;font-size: 11px;">Company Name<br>Report From: 01-07-2014 To: 10-09-2014<br>Company ID: ID Year: 14-15 SortBy: Bill id</p><table class="page-break tablePrint tableclass" style="width:2000px !important;font-size: 10px !important;" border="1" cellspacing="3" cellpadding="3"><tr><td></td></tr> ....... really long table..

мы создали скрипку, чтобы объяснить проблему http://jsfiddle.net/xaor7knL/1 пожалуйста, помогите, мы столкнулись с этой проблемой уже несколько дней. также пытался найти похожие проблемы с переполнением стека, но не смог решить эту проблему.