Why is "rgb (224, 226, 213)" an invalid property value?
You have a space between the rgb
and the (
, which is not allowed:
header h1 {
background-color: red;
color: rgb(224, 226, 213);
}
No, I'm serious, it's not.
Unlike many programming languages, CSS expressly forbids having whitespace between a function name and the opening parenthesis. This applies not only to rgb()
and rgba()
, but also to other functional values such as url()
and attr()
, as well as functional pseudo-classes such as :nth-child()
, :lang()
and :not()
.
Refer to section 4.3.6 of CSS2.1, which states:
The format of an RGB value in the functional notation is 'rgb(' followed by a comma-separated list of three numerical values (either three integer values or three percentage values) followed by ')'. [...] White space characters are allowed around the numerical values.
and also refer to Appendix G for the grammar, precisely the following tokenization, which clearly shows that whitespace is not expected between the identifier and the opening parenthesis:
{ident}"(" {return FUNCTION;}