Datatable styling so bootstrap button appears on same row as other elements

Question

I\'m using jQuery DataTables plugin and Bootstrap on my rails site. I can\'t get my custom button and other table header elements to nest in the same row, They are stacked inste

Answer 1

You have to put two divs: one for the datatable buttons and other for your custom code

       var table = $("#tbl_oferta").dataTable({
                dom: '<"pime-grid-button"B><"pime-grid-filter">frtip',
        ...
       });

       $("div.pime-grid-filter").html('Custom tool bar! Text/images etc.');

Then define div class in your css:

.pime-grid-button{float:left}
.pime-grid-filter{float:left;margin-left:10px}        

Sample Image