Estou usando o plug-in jQuery DataTables e o Bootstrap no meu site de trilhos. Não consigo que meu botão personalizado e outros elementos do cabeçalho da tabela sejam aninhados na mesma linha. Eles estão empilhados em vez de alinhados.

Alguma sugestão para colocá-los todos na mesma linha?

Aqui estão alguns dos JavaScript que eu usei:

$(document).ready(function() {
  $('#products').DataTable( {
    dom: 'Blfrtip',
    buttons: [ {
      text: 'Pull my products',
      action: function ( e, dt, node, config ) {
        alert( 'Button activated' );
      }
    }]
  });
});