How to change the ugly cursor image on disabled radio buttons / checkboxes

Question

I want to remove this ugly red image on hover on disabled controls which appears in most browsers (Chrome, Internet Explorer etc.)

Answer 1

If CSS3 is an option, simply use the :disabled selector and set the cursor to something else:

input[type='radio']:disabled {
    cursor: default;
}

input[type='checkbox']:disabled {
    cursor: default;
}

Answer 2

Just use this

CSS

For radio button in disable state

input[type='radio']:disabled {
    cursor: default;
}

For checkbox in disable state

input[type='checkbox']:disabled {
    cursor: default;
}

Answer 3

/* goodby the ugly cursor image on disabled inputs */
input:disabled {
    cursor: default !important;
}