How to change font-color for disabled input?
You can't for Internet Explorer.
See this comment I wrote on a related topic:
There doesn't seem to be a good way, see: How to change color of disabled html controls in IE8 using css - you can set the input to
readonly
instead, but that has other consequences (such as withreadonly
, theinput
will be sent to the server on submit, but withdisabled
, it won't be): http://jsfiddle.net/wCFBw/40
Also, see: Changing font colour in Textboxes in IE which are disabled
You can:
input[type="text"][disabled] {
color: red;
}
The following gets you pretty close in IE8 and works in other browsers too.
In your html:
<input type="text"
readonly="readonly" <!-- disallow editting -->
onfocus="this.blur();" <!-- prevent focus -->
tabindex="-1" <!-- disallow tabbing -->
class="disabledInput" <!-- change the color with CSS -->
/>
In your CSS:
.disabledInput {
color: black;
}
In IE8, there is a slight amount of border color change on hover. Some CSS for input.disabledInput:hover could probably take care of this.
input[disabled], input[disabled]:hover { background-color:#444; }
Replace disabled
with readonly="readonly"
. I think it is the same function.
<input type="text" class="details-dialog" readonly="readonly" style="color: ur color;">