CSS-Tricks Example

RGBa Support

Last updated: 02/07/2010

.color-block { 
                      
   /* The Fallback Color */
   background: rgb(200, 54, 54);
                      
   /* The Important Bit - Alpha Transparency */ 
   background: rgba(200, 54, 54, 0.5); 
   
}
Colored Pencils
Browser, Version, Platform Outcome Fallback
Firefox 3.6 (OS X) Works --
Firefox 3.0.5 (OS X) Works --
Firefox 3.0.5 (Windows XP, Vista) Works --
Firefox 2.0.0.18 (PC) Doesn't Work Solid Color
Safari 4 (Developer Preview & 4.0.4, OS X) Works --
Safari 3.2.1 (OS X, Windows XP) Works --
Mobile Safari (iPhone) Works --
Opera 9.6.1 Doesn't Work Solid Color
Opera 10 Beta (Linux & Windows) Works --
Opera 10.10 (OS X) Works --
IE 4.01 Doesn't Work No Color
IE 5.5 (PC via IETester) Doesn't Work No Color
IE 6 (PC via IETester) Doesn't Work Solid Color
IE 7 Doesn't Work Solid Color
IE 8 (Beta 2 & release version) Doesn't Work Solid Color
Google Chrome 0.4.154.33 (Windows XP) Works --
Google Chrome 1.0.154.46 (Windows XP) Works --
Google Chrome 4.0.249.49 (OS X) Works --
Netscape 4.8 (PC) Doesn't Work No Color
Navigator 9.0.0.5 Linus Doesn't Work Solid Color
SeaMonkey 1.1.14 Doesn't Work No Color
SeaMonkey 2.0 Works --
Sunrise 1.7.5 Works --
Stainless 0.2.5 Works --
Flock 1.2.7 Doesn't Work Solid Color
Flock 2.0.2 Works --
BlackBerry Storm Browser Works --
Camino 1.6.6 Doesn't Work Solid Color
Camino 2.0b1 Works --
Iceape 1.1.14 (Linux) Doesn't Work Solid Color
Kazehakase 0.5.2 (Linux) Doesn't Work Solid Color
Avant 11.7 (Windows XP) Doesn't Work Solid Color

What the above image should look like (image):