for button-type input (button, submit, reset), background-color inherit doesn't work ('transparent' is used)



13 years ago
13 years ago


(Reporter: mail, Unassigned)


Firefox Tracking Flags

(Not tracked)



(1 attachment)



13 years ago
User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; de-AT; rv: Gecko/20060729 SeaMonkey/1.0.4
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; de-AT; rv: Gecko/20060729 SeaMonkey/1.0.4

When the background colour of <input ...> elements is changed, it can't be "un-changed" (setting it to 'inherit') for the button types 'button', 'submit', and 'reset'; instead, the background colour of the parent element is used (background-color: transparent).

Reproducible: Always

Steps to Reproduce:
input:focus { background-color: yellow; }
input[type="submit"]:focus { background-color: inherit }
2.create an HTML form using this stylesheet, featuring text and submit type input elements
3.visit the input elements using the tab key

Actual Results:  
the background colour of button types is set transparent (b.c. of parent element)

Expected Results:  
the background of button types should be reset to the original colour

Comment 1

13 years ago
Created attachment 233855 [details]
little demo for the background-color bug

Comment 2

13 years ago
That's the expected behavior.  I don't think you understand what inherit does.  When you use inherit it means use the value of the parent element.  The button's background color is not being set to transparent but to the background color of the button's parent element.  

There is one time that inherit means use the initial value.  And that is on the root element because it has no parent.  

From the CSS 2.1 spec:
6.2.1 The 'inherit' value

Each property may also have a specified value of 'inherit', which means that, for a given element, the property takes the same computed value as the property for the element's parent. The 'inherit' value can be used to strengthen inherited values, and it can also be used on properties that are not normally inherited.

If the 'inherit' value is set on the root element, the property is assigned its initial value. 
Last Resolved: 13 years ago
Resolution: --- → INVALID

Comment 3

13 years ago
1. Oh my. If "inherit" does mean the same as "transparent", then why use an own value? Looking at this, I consider this a bug in the CSS standard, which maybe was undiscovered since for most cases (but buttons and, possibly, hr) there is no difference

2. Considering the actual behaviour correct -- how would you define "change the background colour for all input elements on :focus with the exception of reset, button and submit"? And it doesn't work to just select input[type="text"] (and password), because many "normal" input fields don't have this attribute because it is the default.

3. Opera (tested with the current version 9.01 [Opera/9.01 (Windows NT 5.1; U; de)]) does it like desired (at least for the typical use case which doesn't apply any other styles to buttons); using the value inherited by descendance rather than containment IMHO is the much smarter decision.
You need to log in before you can comment on or make changes to this bug.