Проблема с расширением фиксированного заголовка данных, перемещающимся из правильного положения

Question

У меня возникли проблемы с использованием данных и сборки с фиксированным заголовком вместе. Проблема возникает, когда плавающий div взаимодействует с фиксированным заголовком, заставляя фиксированный заголовок отойти от головки таблицы и дважды отображать заголовок.

Это похоже на сбой на странице, хотя он исправляет себя, как только пользователь снова прокручивает мышь.

Кодекс для DIV с кнопками:

<div id="container_btn_float" class="btnContainer" style="position:fixed; z-index:110; top:50px" > 
        <div class="row"> 
         <div class="form-group col-md-12"> 
          <!--<label class="">Approve &nbsp &nbsp</label>--> 
          <input type="button" class="btn btn-info" id="btn_ApproveSelected" value="Approve"> 
         <input type="button" class="btn btn-success" id="btn_ApproveAll" value="Approve All"> 
         <input type="button" class="btn btn-danger" id="btn_UnApproveSelected" value="Decline"> 
         <input type="button" class="btn btn-primary" id="btn_ExpandAll" value="Expand All" onclick="expandAll()"> 
         <input type="button" class="btn btn-warning" id="btn_ContractAll" value="Contract All" onclick="contractAll()"> 
         <!--<input type="button" class="btn btn-warning" id="btn_UnApproveAll" value="All">--> 

        </div> 

        iv> 
      </div> 

Кодекс для DataTable является:

new $.fn.dataTable.FixedHeader(summaryTable, { 
    }); 

Кодекс для фиксированного DIV при прокрутке (с кнопками):

 jQuery(function($) { 
      function fixDiv() { 
      var $cache = $('#getFixed'); 
     if ($(window).scrollTop() > 100) 
      $cache.css({ 
      'position': 'fixed', 
      'top': '10px' 
     }); 
     else 
     $cache.css({ 
      'position': 'relative', 
      'top': 'auto' 
     }); 
     } 

     $(window).scroll(fixDiv); 
     fixDiv(); 
    }); 

Answer 1

Я добавил второй контейнер div с кнопкой так же, как и другие кнопки, но я установил его отображение на none и дал его так me css, чтобы он имел равный размер div, содержащий div, который в конечном итоге переместился и оставил место, где он был первоначально размещен.

  <div class="form-group col-md-4" id="container2_btn_stay" style="height:76px;width:90px"> 
        <!--Just some hidden text--> 
        <input type="button" class="btn btn-warning" id="btn_HiddenBox" value="HiddenBox" style="display:none"> 
      </div>