CSS: Get "disabled" input background color?

Question

Is there a special CSS system color equivalent to the system's disabled text input background color? I know there's one for the disabled text color (GrayText), but I can't find one for the background color.

To make it more clear, I'm looking for the background color that gets set when you do something like:

<input type="text" disabled />

I don't want to restyle disabled inputs; I want to use the existing system style elsewhere.

Edit:

To be even more clear, I'm looking for the system color keyword, not the actual color. For example, to use the system's defined disabled text color, you would do this:

<span style="color: GrayText;">This text looks like disabled text in your operating system</span>

I just can't find the one for the background color.

are you saying you want to know the specific hex color of that background? — Kristian
– Kristian, Commented Apr 27, 2012 at 21:11
What about using Firebug (getfirebug.com) or Chrome Inspector to figure it out? — yoda
– yoda, Commented Apr 27, 2012 at 21:11
No, I want the system color name used in CSS (if there is one). See here for the ones I looked through. I'm wanting to know if I've overlooked it, or if it's a later addition, or just doesn't exist. — FtDRbwLXw6
– FtDRbwLXw6, Commented Apr 27, 2012 at 21:19

David · Accepted Answer · 2013-11-12 21:22:37Z

3

I encountered this issue while trying to style a javascript replacement for a select. While there has been no progress in the CSS spec, there is a jQuery alternative.

$("input:disabled").css("background-color")

This returns a RGB color from an already disabled input, so unfortunately it's not as flexible as a CSS color, but it will work across browsers and reacts to custom colors applied to disabled elements through CSS.

answered Nov 12, 2013 at 21:22

David

758 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Ctrl-C Over a year ago

This seems to be the best solution now. Even if you don't have such disabled input, you can create one ($('<input disabled>')), append to the body (so the CSS is evaulated), read the value and detach. Maybe also set display to none before appending to avoid blinking, but I'm not sure if every browser will set background-color if it's not visible.

isNaN1247 · Accepted Answer · 2012-04-27 21:30:10Z

0

This isn't the purpose of the keyword - the use of colour [I believe] is technically up to the browser vendor - if they observe the OS preferences then thats up to them.

There are a small number of color names originally in the W3C spec. However these were extended to include the list of X11 color names that were supported by most browser vendors.

Together those lists are all the valid names acceptable in a browser.

answered Apr 27, 2012 at 21:30

isNaN1247

18.2k13 gold badges75 silver badges119 bronze badges

Comments

FtDRbwLXw6 · Accepted Answer · 2012-07-10 21:05:53Z

0

According to the latest CSS spec, there is no system color keyword for "disabled" background color.

answered Jul 10, 2012 at 21:05

FtDRbwLXw6

29.1k16 gold badges74 silver badges108 bronze badges

Collectives™ on Stack Overflow

CSS: Get "disabled" input background color?

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related