Search code examples
cssgridviewyiicellbackground-color

Yii gridview change cell background color


I would like to change background color in a (bootstrap) grid in yii, depending on compared cell values. It took me a while to figure out where do I even have to place CSS class to get something - .../protected/css/styles.css:

.notice {
    background:#FFF6BF;
    color:#514721;
}

I hope this is the right place. In my grid:

'columns' => array(
    ...
    array(
        'name' => 'Pcs',
        'cssClassExpression' => '$data["Pcs"] <> $data["Pcs"] ? "notice" : ""',
    ),

this way, my css definition is applied only in every second row. I've read a lot about this in different topics: CGridView. Add custom class to table rows preserving original „odd“ and „even“ and also here in stackoverflow.com. I know there are "odd" and "even" rows, but I still don't get the picture. I've tried to manually change rowCssClassExpression

'rowCssClassExpression' => '',

because I thought if I disable basic yii row coloring, my css will apply, and in html source I can see there are proper class definitions for each row, but still, rows background color remained the same. What should I do to make it work? Thanks a lot!


Solution

  • Your css rules are being ignored. The selector that's being applied is table tr td thus yours should be as follows

    table tr td.notice {
        background:#FFF6BF;
        color:#514721;
    }
    

    If this doesn't work you could always set the rules using !important