Slightly ajar

As announced previously on this blog, i've been asked to write for CSS3.info. My first post has just been published yesterday. This is the first in a series of articles on how to use CSS3 properties that have an existing implementation, focusing on real world style examples. effort has been made to write the examples in a way that degrades gracefully in browsers that do not support the required CSS3 property. In this article, I demonstrated the use of the new RGBA color value. This adds a alpha channel to the existing RGB value. This is currently supported in both Safari and Firefox. The advantage over opacity is that opacity is applied to the entire element (such as the text and background) while RGBA can be applied to just the background or text colour. As browsers are instructed to ignore RGBA values if they do not understand the alpha channel, as opposed to just applying the red, green and blue channels ignoring the alpha channel, it is important to apply a regular colour value before specifying the RGBA value, such as background-color: rgb(255, 0, 0); background-color: rgba(255, 0, 0, 0.6);. Browsers that support RGBA will override the regular colour.