html - Change the appearance of a disabled link

Question

Is it possible to change the appearance of an html link when it's disabled? For example using something like:

a.disabled
{
  color:#050;
}

<a class="disabled" disabled="disabled" href="#">Testing</a>

The example above does not seem to work with IE but works for Firefox, on IE it remains gray even when I set the colour in the style. If I remove the disabled="disabled" however it works.

Answer 1

The :disabled pseduo class only works with input fields, like text, radio, checkbox, etc. and applies when you give the element the attribute `disabled="disabled". IE6, however, doesn't recognize the pseudo class, so you'll need to use a class separately to make it work.

<input type="text" value="You can't type here" disabled="disabled" class="disabled" />

can be styled with

input[disabled="disabled"], input.disabled {
    /* whatever you want */
}

The pseudo class will apply to modern browsers while the class will cover IE6.

Like Radeksonic said, if you want the disabled CSS to appear on other elements, like anchors, you'll just need to make and use a class. There's no disabled attribute for <a>s