title: Popover on DataTables Fixed Column looks strange when horizontally scrolling
body: <p>I have an issue where I am trying to put popovers on the first column of a table that is fixed. The popovers look fine before you start to horizontally scroll (see test case below). Once you start scrolling, the popover starts to appear at the left edge of the table which looks strange. Any help would be appreciated.</p>
  
  <p>I have tried a variety of solutions including using fixedColumns().relayout() and .popover('update) to refresh the location of the fixedcolumn and popover while scrolling but it's not working the way intended:</p>
  
  <pre><code>  $( table.table().container ).on('scroll', function() {
         setTimeout(function() { $.fn.dataTable
        .tables( { visible: true, api: true } )
        .columns.adjust()
        .fixedColumns().relayout();
        $('.pop').popover('update'); 
        },300)
    });
  </code></pre>
  
  <p>Using Bootstrap 4 and Popper.js.</p>
  
  <p>Test case: <a href="http://live.datatables.net/zudapubo/1" rel="nofollow noreferrer">http://live.datatables.net/zudapubo/1</a></p>
  
  <p>Update 1 - Adding JS Fiddle for those that prefer it: <a href="https://jsfiddle.net/t8w57qj9/" rel="nofollow noreferrer">https://jsfiddle.net/t8w57qj9/</a></p>
  
  <p>Thank you</p>