RGB and RGBA

  • Resolved astima

    (@astima)


    10 years, 2 months ago

    In the CSS I am setting the RGBA value and I have read I should set at RGB value as a backup for browsers that do not support RGBA. However browsers that support RGBA are selecting to use the RGB value instead. How do I force a browser to use the RGBA value over and RGB value?

    Here’s what I have:

    #featured{

	background:rgba(54,87,59,0.9);
	background:rgb(54,87,59);
 	 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#2236573B, endColorstr=#2236573B);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#2236573B, endColorstr=#2236573B)";
}
Viewing 2 replies - 1 through 2 (of 2 total)
  • Drew Westcott

    (@drewwestcott)

    10 years, 2 months ago

    Hello

    Could you try reversing the background: lines so that the rgba declaration is after the rgb one.

    CSS uses the idea of cascading, i.e. it always uses the last valid declaration, therefore I suspect that browsers are seeing the second background: rgb(54,87,59); and assume that this is overiding any previous background: ones.

    #featured {

background:rgb(54,87,59);
background:rgba(54,87,59,0.9);
 	 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#2236573B, endColorstr=#2236573B);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#2236573B, endColorstr=#2236573B)";
}

    By putting the rgba declaration last, all browsers that support it will use it, and those that do not support it will simply ignore it and therefore the last valid backgound: declaration will be the standard rgb one.

    Hope that makes sense.

    Let me know how you get on.
    Drew

    Thread Starter astima

    (@astima)

    10 years, 2 months ago

    Thank you, that worked! I didn’t realize that the order affected how it was displayed. I would’ve never thought to move them around.

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘RGB and RGBA’ is closed to new replies.

Tags