CSS color overrides disabled flag on input element

RESOLVED INVALID

Status

()

Core
Layout: Form Controls
RESOLVED INVALID
16 years ago
13 years ago

People

(Reporter: Jørn Lind-Nielsen, Assigned: rods (gone))

Tracking

Trunk
x86
Windows 2000
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

Attachments

(1 attachment)

(Reporter)

Description

16 years ago
From Bugzilla Helper:
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:0.9.9) Gecko/20020408
BuildID:    2002040809

When you specify a color for an input element, such as a button or a text field,
this color overrides the enabled/disabled setting. A consequence of this is that
you cannot detect disabled elements when you specify a foreground color.

Is this a bug or by intention?

Reproducible: Always
Steps to Reproduce:
See the supplied example.
(Reporter)

Comment 1

16 years ago
Created attachment 81374 [details]
Example illustrating disable vs. color problem
(Reporter)

Comment 2

16 years ago
I know you can still se the disabling because of the borders -- but in my
application I also change these for a special layout.
it has to be changed for all input-Elements. Why shouldn't it?
Status: UNCONFIRMED → RESOLVED
Last Resolved: 16 years ago
Resolution: --- → INVALID
(Reporter)

Comment 4

16 years ago
You are right - the foreground color has to be changed when you specify so.

But - when you disable an input element, shouldn't it then be visualized as 
such? Normaly the browser does so by changing the foreground color to gray.

So in the current situation you have:

1) "Use default color" implies "and allow the browser to visualize disabling".
2) "Use custom color" implies "do not allow browser to visualize disabling".

This means you distinguish between default colors and custom colors. But isn't 
the default color just a color as well as any other color? What if I 
specifically said "use default color" instead of just saying nothing (and 
thereby implying "use default). Should it then be impossible to visualize 
disabling?

So IMHO default colors are exactly the same as custom colors - you just don't 
have to specify them. Which means disabling should be visualized also when you 
specify custom colors.
Well... The thing is, to follow CSS2 the browser has to act like its rendering
is determined by a "user-agent stylesheet".  This stylesheet for mozilla looks
something like:

input { color: something; background: something; }
input[disabled] { color: something-else; background: something-else; }

Now you set a rule for input.colored which takes precendence over both those
rules, and so is applied regardless of the disabled state....

We _could_ make the input[disabled] rules !important, but then you would not be
able to style disabled input elements at all (and this would make them invisible
on some pages, eg).

IE doesn't implement attribute selectors, so they cannot actually attempt to
follow the CSS spec on this issue....

A simple solution in your case is to add an

input.color[disabled] { }

rule to your stylesheet in which you can style it any way you wish (eg a lighter
blue).

> What if I  specifically said "use default color"

Except there is no way to say this in CSS....
for me it's the same problems as a{}, which also applies to some <h1><a
name="bla">Head</a></h1> construct. The color applies to all <input/> elements,
no matter if enabled or disabled. As Boris wrote a input[disabled]{color:gray;}
should solve the problem.
(Reporter)

Comment 7

16 years ago
Now that solves the problem! I didn't know of attribute selectors - now there's 
no problem at all.

Thanx.
*** Bug 281380 has been marked as a duplicate of this bug. ***
*** Bug 294677 has been marked as a duplicate of this bug. ***
You need to log in before you can comment on or make changes to this bug.