According to http://www.w3.org/TR/CSS21/colors.html#background-properties

The value order of background property is 'background-color', 'background-image', 'background-repeat', 'background-attachment', 'background-position'

I know it works in any order but it becomes annoying if you got used to read/write in the standard order and copy the values from firebug to the css file.

Hi, could you please attach a simple test case file (+ description how to use it) that uses the CSS rule and we can use it to see the wrong behavior you describing. It really helps us to fix the problem. Thanks! Honza

1. Inspect the body tag of this page
2. Firebug displays the background property like this: none repeat scroll 0 0 #FFFFFF
3. Correct order would be this: #FFFFFF none repeat scroll 0 0

at least thats what the W3C says (see Link above, scroll down untill 'background' is highlighted in yellow)

I see this too. Added a minimal testcase that shows the behaviour.

1. Inspect the body and look at the style tab

Expected:

body { background: green none repeat-x fixed 50% 5px; }

Actual:

body { background: none repeat-x fixed 50% 5px green; }

Thanks for the test case!

Will be online at: http://getfirebug.com/tests/content/branches/1.8/css/4180/issue4180.html

But, the string "background: none repeat-x fixed 50% 5px green;" is what Firefox API returns, so Firebug doesn't change the order.

If there is a required/recommended order of the background properties in the spec we can ask to change Firefox API, but I don't see any note about this. I took a quick look here:

http://www.w3.org/TR/CSS21/colors.html#background-properties http://www.w3.org/TR/css3-background/#the-background

Honza

I also realized that some time ago (and yes, I also don't like how it is at the moment), though I guess as long as there is no required order, Mozilla probably won't change it. Also I think this is more an enhancement than a defect.

I created an automated test case for this in r10851 (using the new test case template).

Issue 5180 has been merged into this issue.

I'll make a fix for this over the weekend.

I created a related report: https://bugzilla.mozilla.org/show_bug.cgi?id=720945

I'll make a fix for this over the weekend. According to http://www.w3.org/TR/css3-background/#the-background this this seems to be the correct order now. So I would avoid changing the order in Firebug. I was asking the Mozilla guys in the bug report, but I guess the only way to get this in the "right" order again, is to let the W3C people know about that.

Sebastian

The only reason I see them doing this is because color can't be first if you have multiple backgrounds (though it can be first on the last background). I'm only in the W3C HTML group, but I should probably join the others so I can whine there. ;)

So they are trying to get people to put the color last since they think devs will be too stupid to understand the rules, yet go against many years of tutorials, books etc., and yet don't allow a single "floating" color declaration. Design by committee.

I like Chrome's way here... only show that which the user authored. If the user wants to know the defaults, then they can open up the see the all the background related properties. Of course, they go one step further, and cross reference with the actual text and put it in the same order.

Anyway, I'll hold off for the moment.

I'm only in the W3C HTML group Is it possible for ordinary mortals to get into that groups? I read somewhere at their page, that you have to pay a big pile of money to be part of them, even as single person.

If the user wants to know the defaults, then they can open up the see the all the background related properties. Yes, I'd also prefer to remove the "Expand Shorthand Properties" option in favor of an expandable UI. Btw. that's also how the Firefox web developer tools are doing it. Could you create a new issue for that, so it's not forgotten?

Sebastian

There's currently a related discussion on the www-style mailinglist:

http://lists.w3.org/Archives/Public/www-style/2012May/1202.html

Sebastian

Could you create a new issue for that, so it's not forgotten? Nobody cared, so I created issue 5523 for this.

I like Chrome's way here... only show that which the user authored ... Of course, they go one step further, and cross reference with the actual text and put it in the same order. Firefox just gives us the interpreted values. So we would also need to read the property from source if we want to display only user-authored styles. But I need to say that this would mix the live view on the things with the source view, which wouldn't be that nice in my eyes. I think there is no issue for that yet, though. So if somebody wants to have that, please file one for that.

Sebastian

I think there is no issue for that yet, though. So if somebody wants to have that, please file one for that. Totally forget that there is already a related Buzilla report: https://bugzil.la/713760

Sebastian

I meant "forgot", not "forget", and "Bugzilla", not Buzilla. I need vacations! :-)

Sebastian

Great news. I could bring the W3C to change its standard[1], so in the serialization of the 'background' shorthand value the color value goes to the front.

And this change got already implemented in Firefox yesterday[2]. The change will be in Firefox 38 and you can already try it out in today's Nightly build.

Sebastian

[1] http://lists.w3.org/Archives/Public/www-style/2015Jan/0406.html [2] https://bugzilla.mozilla.org/show_bug.cgi?id=743392#c13