Question

Is there a way to simplify the following css rule so that .x-grid-row selector won’t have to be repeated?

#OpenRequestListGrid .x-grid-row, #MyRequestListGrid .x-grid-row {
    line-height: 13px;
    padding: 0 1px;
    vertical-align: top;
    background-color: #BBB;
}

Important issue here is that I don’t want to specify .x-grid-row by itself as this rule is from a larger library.

Note: maybe I wasn’t clear the first time but I don’t want to use .x-grid-row as this will effect other grids that I want to leave alone. I would like to target just my two grids. What I am aiming for is not repeating the same config twice one for each grid ID.

HTML sample :

<div id="dontChangeMe" class="x-grid-row">
<div id="OpenRequestListGrid" class="x-grid-row">
<div id="MyRequestListGrid" class="x-grid-row">

Answer 1

So the Answer is there really isn’t another way. Repeating element id and then the same selector is necessary. Thanks to all those who replied.