terrielung

Hi, I have been having some problem with transform and animations. The css codes are working with a svg image. Everything is working fine in Firefox, but transform does not work in IE11, transition animation does not work in Chrome, and everything falls apart in Mac OS X browsers. I'm new at this and don't know where the problem is, please can anyone help me? Thank You. These are the codes: [id$=group] { -webkit-transition: -webkit-transform 0.5s ease-in-out, opacity 0.5s ease-in-out; -moz-transition: -moz-transform 0.5s ease-in-out, opacity 0.5s ease-in-out; -o-transition: -o-transform 0.5s ease-in-out, opacity 0.5s ease-in-out; transition: transform 0.5s ease-in-out, opcaity 0.5s ease-in-out; } [id$=group] { opacity: 0; -webkit-transform: scale(0.35,0.35); -moz-transform: scale(0.35,0.35); -ms-transform: scale(0.35,0.35); -o-transform: scale(0.35,0.35); transform: scale(0.35,0.35); } [id$=group]:hover { opacity: 1; -webkit-transform: scale(1,1); -moz-transform: scale(1,1); -ms-transform: scale(1,1); -o-transform: scale(1,1); transform: scale(1,1); } @-webkit-keyframes translateX { 0% {transform: translateX(250px); opacity: 0; } 100% {opacity: 1;} 100% {tranform: translateX(0px);} #title_type { -webkit-animation: translateX 3s; -moz-animation: translateX 3s; animation: translateX 3s; }