Search code examples
jquerydatatables

How can I add background color to datatable search box and select box

I am working with jquery-datatable and want to add a background color to the select box and the search box. So it looks like the header with the same background color.

$(document).ready(function(){
  $('#users').DataTable();
})

How can I pass the attribute to the datatable to change the background color of the select box and the search box?

Solution

  • How your headers looks like depends on which CSS theme you are using (default, jQueryUI, bootstrap, foundation) so cant tell exactly what color you need. But to change the background-color for the length menu and search box use the below CSS and replace "red" with the color you want :

    .dataTables_length select {
   background-color: red;
}
.dataTables_filter input {
   background-color: red;
}

    demo -> http://jsfiddle.net/rw27Lz11/