ffffff01 ffffff01 - 6 months ago 138
CSS Question

How to change background of header and rows in Jqgrid?

I need to change the background of the header and also the rows of a Jquery grid. I have tried to change several css classes but I dont get the result I want.

Answer
// this changes the background image of the header
.ui-jqgrid .ui-widget-header{
   background-image: url(myBackground.jpg) repeat-x !important;
}

// this changes the background color of every row in a jqgrid
.ui-jqgrid tr.jqgrow {
    background-color: yellow !important;
}

Note: !important might not be necessary.

Also make sure that your css file is loaded after jqgrid's css file!

<link rel="stylesheet" type="text/css" media="screen" href="ui.jqgrid.css" />
<!-- load jqgrid css first then your css -->
<link rel="stylesheet" type="text/css" media="screen" href="mystyle.css" />