Multiple CSS backgrounds, colour over image, ignored

Question

What\'s wrong with this multiple background CSS line. Firefox 4 ignores it (as it does when there\'s a syntax error).

background: rgba(255,0,0,0.2), url(\"st         


        

Answer 1

The syntax for background in CSS3 Backgrounds is [ , ]* , which means zero or more s and then a single , separated from each other by commas. See http://www.w3.org/TR/css3-background/#the-background

A is defined as:

 =  ||  [ /  ]? || 
                    ||  || {1,2} ||
                   <'background-color'>

whereas a is:

  =  ||  [ /  ]? ||
               ||  || {1,2}

(both definitions at http://www.w3.org/TR/css3-background/#ltbg-layergt ).

Or in simple terms, only the lowest background layer can include a background color. So yes, your CSS is in fact a syntax error.

Oh, and looks like https://developer.mozilla.org/en/css/multiple_backgrounds had some errors in it. I've fixed them.