CSS background Property Works in Opera, not in FF or IE

[JAG]

Hi guys,

I'm trying to use the shorthand CSS background property, including all the new CSS3 properties. For some reason, it only works in Opera, not in IE (which I kinda expected), but surprisingly it doesn't work in FF5 either, my main browser.
What am I doing wrong?

.home_page_item {
background: url(/images/metal_plate_bg.jpg) center / 100% 100% no-repeat fixed padding-box border-box transparent;
}

[sunfighter]

It's background: <background-color> || <background-image> || <background-repeat> || <background-attachment> || <background-position>

Not sure what the 'padding-box border-box transparent' you have is.
Not sure if this has to be the above order.
And I think the url of url(/images/metal.... should be url(./images/

[JAG]

Yes, those three values are for background-size, background-origin and
background-clip, the three new background properties starting with CSS3. Problem is, both FF5 and IE9 are supposed to support them, but I can only get it working in Opera with the new, extended shorthand method.

[vikram1vicky]

Originally Posted by JAG

Hi guys,

I'm trying to use the shorthand CSS background property, including all the new CSS3 properties. For some reason, it only works in Opera, not in IE (which I kinda expected), but surprisingly it doesn't work in FF5 either, my main browser.
What am I doing wrong?

.home_page_item {
background: url(/images/metal_plate_bg.jpg) center / 100% 100% no-repeat fixed padding-box border-box transparent;
}

I tested your code on CSS validator and got following error

Value Error : background border-box is not a background value : url(/images/metal_plate_bg.jpg) center/100% 100% no-repeat fixed padding-box border-box transparent url(/images/metal_plate_bg.jpg) center/100% 100% no-repeat fixed padding-box border-box transparent

[JAG]

Originally Posted by vikram1vicky

I tested your code on CSS validator and got following error

I removed the offending code, tested the page again, and still no enchilada. :-(
Even tried using other values for background-clip: content-box and padding-box. Guess I'm forced to stick with the longhand method; I was trying to optimize my code. If anybody finds the right way to use the shorthand method, let me know.