Currently, I am immersed in a project that involves HTML5, MVC 4, CSS 3, JQuery, and LINQ. We have meticulously designed styles for various ui, li, and other html controls within the project.
However, I now face the challenge of integrating a JQ Grid (http://www.trirand.com/blog/jqgrid/jqgrid.html) into our existing setup. While we had been using our customized client-side grid, incorporating the style sheet of the JQ Grid on the page poses a risk of affecting other elements. My solution is to confine the JQ Grid inside a div element so that its style sheet only impacts the elements within that specific division.
Is there any way to achieve this seamlessly?
(I am pondering if the following approach would work:
<div id="jqgridcontainer" stylesheet="styles/jqgrid/jqstyles.css"> my ui elements here </div>
I understand that this method may not be feasible.)
NB: Modifying http://www.trirand.com/blog/jqgrid/themes/redmond/jquery-ui-custom.css[^] by adding "jqgridcontainer" div id to all element css rules is not an option.