<h:inputText> enabled/disabled - change background color

Question

can I change background color for disabled <h:inputText>?

I've tried to do this way:

<h:inputText value="test" disabled="true" styleClass="input"/>

css contains:

input:disabled {background-color:blue;}
input:enabled {background-color:red;}

and result is:

reason, why I'm trying to change the background is, that since I've installed richfaces, disabled and enabled has the same color, both are white

Thank you

UPDATE:

HTML:

<td class="width10">Směna:</td>
<td class="width15"><input name="bde:j_idt100" value="2011-05-18-S2" size="13" style="background-color: blue; color: red;" disabled="disabled" type="text"><input id="bde:shift" name="bde:shift" type="hidden"></td>
<td><input name="bde:j_idt102" value="ranní" class="input2" size="13" disabled="disabled" type="text"><input name="bde:j_idt103" value="admin" class="input2" size="13" disabled="disabled" type="text"></td>
</tr>
<tr class="rowEven">
<td class="width5"><input id="bde:f1" name="bde:f1" value="F1" tabindex="2" title="Novy pracovnik - vymaze vsechna pole formulare" class="btninput" type="submit"></td>
<td class="width10">Pracovník:</td>
<td class="width15">
<input id="bde:worker" name="bde:worker" class="input" size="13" tabindex="1" onblur="jsf.util.chain(this,event,'mojarra.ab(this,event,\'blur\',\'@this\',\'bde:inputName\')','mojarra.ab(this,event,\'blur\',\'@this\',\'bde:inputSname\')','mojarra.ab(this,event,\'blur\',\'@this\',\'bde:inputDep\')','mojarra.ab(this,event,\'blur\',\'@this\',\'bde:reportErr\')')" type="text"></td>

Graphic differences between richfaces generated code and HTML:

Answer 1

Try with this

<h:inputText value="test" disabled="disabled" style="background-color:blue; color:red;" />