Orchard Overriding CSS?

Topics: Troubleshooting, Writing modules
Jun 29, 2011 at 2:26 PM
Edited Jun 29, 2011 at 7:30 PM

Hello again, community. 

I am wondering if anyone has ever used the Datatables jQuery plugin with Orchard? ( Allan Jardine http://www.datatables.net/ )

In the past I've had issued with CSS conflicting and causing my tables' widths to screw up. By that I mean things like the width not being constant, as well as not big enough to fit the data in the column, causing some rows to take two lines, etc. It's ugly. My method of fixing it in my very brief experience with Datatables has been to start with a new project and be very careful not to get in the Datatables CSS's way. In Orchard, though, it's obviously not that easy.

So again, I'm wondering if anyone else has run into this issue before and how they fixed it. Any other insight would be appreciated as well. Maybe this is something I should be posting on the Datatables forums?


I solved the width problem, only by hard coding  width:100%  into my view. Normally it would be included in my CSS.

So I suppose my real issue here is that my custom CSS, required for something specific such as Datatables in this case, is being overridden by Orchard CSS and this is wreaking havoc. Issues include things not being bolded and aligned as they should be, according to the CSS I have included with the view. Is there any way to override the Orchard CSS for a section of a page? Or something to make what I code what I see? Since I am using a premade jQuery plug-in, it would be very hard for me to go through and change the names of all the CSS classes so that Orchard doesn't interfere.


I may make new post about this, since the previous question is essentially irrelevant