Datatables CSS conflicting with other CSS definitions

juliano

I'm trying to use the example from http://datatables.net/media/blog/cdn/ in my page, but the CSS seems to be conflicting with existing stylesheet as things like alternate rows are not working.

How can I fix this?

allan

If you pull in CSS from a third party source there is always some chance of a conflict, since because classes can overlap in meaning between sources. The DataTables CSS for row highlighting looks like this (v1.9+):

[code]
table.dataTable tr.odd { background-color: #E2E4FF; }
table.dataTable tr.even { background-color: white; }
[/code]

So if your own tables have a class of 'dataTable' and row classes of 'odd/even' then they will also get colouring. The way to avoid that is to either modify the DataTables CSS (hosted on your own server of course) or alter your page.

DataTables classes should always be namespaces to try and keep conflicts to a minimum.

Allan