datatable style through css


I am trying to style the tables in my app (rendered through renderDataTable) using css, so they would remain consistent with the theme color and so on. I saw on the javascript documentation that this is possible, but just copy-and-pasting the css code in www/style.css does not work for me.

Playing around the inspector, I realized that part of what I wanted to change (the border colors) are cascading from jquery.dataTable.min.css, so I'd have to change on every element, which is not ideal.

My question is: is this something possible to do?

how are you linking the css file to the shiny app?
theme option?
tags - head and link?

you can also try includeCSS where the css file does not have to be in the www directory

Tags. Shiny is loading the css from there, that part is working for everything else in the app.

You could include some jquery after loading the table to change the borders. For example:

output$table <- DT::renderDataTable({

table <- DT::datatable(
    options = list(
                   initComplete = JS(
                   "function(settings, json) {",
                      "$('td').css({'border': '1px solid black'});",
                      "$('th').css({'border': '1px solid black'});",


For more options you can also see the below post on Stackoverflow:

This topic was automatically closed 54 days after the last reply. New replies are no longer allowed.