background color and font color transition

Question

I know how i can change bg-color and font color with transition in css3:

/**Background color transition**/
-webkit-transition: background-color 300ms linear;
-moz-transition: background-color 300ms linear;
-o-transition: background-color 300ms linear;
-ms-transition: background-color 300ms linear;
transition: background-color 300ms linear;

/**Font color transition**/
-webkit-transition-property:color, text;
-webkit-transition-duration: 1s, 1s;
-webkit-transition-timing-function: linear, ease-in;

-moz-transition-property:color, text;
-moz-transition-duration:1s;
-moz-transition-timing-function: linear, ease-in;

-o-transition-property:color, text;
-o-transition-duration:1s;
-o-transition-timing-function: linear, ease-in;

My question is, i can set two transitions (bg and font color) in same class? Thanks!.

Answer 1

You can use short hand transitions as follows if you want to combine them:

CSS

-webkit-transition: background-color 300ms linear, color 1s linear;
-moz-transition: background-color 300ms linear, color 1s linear;
-o-transition: background-color 300ms linear, color 1s linear;
-ms-transition: background-color 300ms linear, color 1s linear;
transition: background-color 300ms linear, color 1s linear;