How to change the style of dataTable

TerreTux

Hi,
I would like to change the syle of the dataTable and I would like to put this style

Actually I use the style

 <table id="firstDt" class="table table-hover table-striped table-bordered dt-responsive nowrap" cellspacing="0" width="100%" >

I've seen style jQuery UI ThemeRoller here https://datatables.net/examples/styling/jqueryUI.html

I added the class = display and there no change

Have you any suggestion ?

kthorngren

To apply custom styles you can use the browser's inspect tool to find the elements and their selectors to allow you to specify custom CSS settings. I took the example from your other thread and inspected the area where the length change and search input are placed:

I created this CSS:

.dataTables_wrapper  div.row:first-of-type {
  background-color: gray;
}

http://live.datatables.net/suqayoxe/8/edit

You can see it in the CSS tab of the example. Since you are using Bootstrap you will need to use Bootstrap table classes on the table tag. The display class is not one that Bootstrap supports.

Kevin

TerreTux

Hi,
I am a bit lost.
Where can I add .dataTables_wrapper...?

I was able to modify <thead></thead> with the ```class = "thead-light"``

kthorngren

Where can I add .dataTables_wrapper...?

The answer is the same as your other thread.

Kevin