Applying "compact" to datatables

fergiepl

I am using this code

<

table cellpadding="0" cellspacing="0" border="0" class="display compact" width="100%" >

But I still do not have a "compact" look.

I have this code as well

<style type="text/css" title="currentStyle">
@import "[siteurl]/wp-content/datatables/DataTables-1.10.11/css/jquery.dataTables.min.css";
@import "[siteurl]/wp-content/datatables/DataTables-1.10.11/css/responsive.dataTables.min.css";
@import "[siteurl]/wp-content/datatables/Buttons-1.1.2/css/buttons.dataTables.min.css";
.lb {
float: left;
clear: both;
}
</style>

allan

Thanks for your question - however, per the forum rules can you link to a test case showing the issue please. This will allow the issue to be debugged.

Information on how to create a test page, if you can't provide a link to your own page can be found here.

Here is a simple test case with a compact style: http://live.datatables.net/tawejoku/1/edit .

Thanks,
Allan

fergiepl

Sorry! Thank you for your help.

https://www.riverviewcamp.org/qrynametag-2/

allan

The styles in style.css is overriding DataTables compact styling:

table.cart th, #main-content table.cart th, table.cart td, #main-content table.cart td, table.cart tr, #main-content table.cart tr, #content-area table tr, #content-area table td, #content-area table th {
    max-width: 100px;
    padding: 0.857em 0.587em;
}

Right click on a cell in the table and select "Inspect" - it will show you where the styling is coming from.

Allan

fergiepl

many thanks!