Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do you style disabled textarea in IE8?

What rule do you need to enable styling of disabled elements in IE8? I have the code below now. It that works fine under IE7, but not on IE8. IE8 just give me plaint wihte background. Why?

input[disabled], input:disabled, textarea[disabled], textarea[disabled="disabled"], textarea:disabled {
    background:#EBEBE4;
}
like image 579
Marwelln Avatar asked Mar 30 '11 11:03

Marwelln


2 Answers

the :pseudo class in the selector is tripping up IE8!

you have to ungroup these selectors if you absolutely have to use those CSS3 pseudo classes;

If there's a selector in the ruleset that IE8 doesn't understand it's ignoring the whole thing - this is common in IE8 with CSS3 pseudo classes

e.g. If you separate them out and remove the pseudo :disabled parts of the selector completely - you'll see the first example below works for all, whereas the second one still works except for IE7

input[disabled], select[disabled], textarea[disabled] {background-color: #0f0;} /* lime green - works in IE7+ and modern browsers */

input[disabled="disabled"], select[disabled="disabled"], textarea[disabled="disabled"] {background-color:#ff0;} /* yellow -  IE8+ and modern browsers */

the color (as opposed to background-color) issue pointed at in another answer is not the cause of your issue, but it wouldn't help if you were also trying to change the color ;)

like image 86
clairesuzy Avatar answered Nov 10 '22 22:11

clairesuzy


Another option is to add a disabled class and style it:

input.disabled, textarea.disabled{ 
    background:#EBEBE4; 
}
like image 28
bluefoot Avatar answered Nov 10 '22 21:11

bluefoot