CODEWITHSUNDEEP
asp.netcssbrowsercross-browser
CyberDx
CyberDx

Reputation: 27

Cross-Browsers css

<asp:ImageButton ID="Bt_1" runat="server" CausesValidation="false" CssClass="clr_bt" />
.clr_bt
{
    -webkit-transform: rotate(-50deg);
    -webkit-transition: -webkit-transform 0.5s ease-in;
}

Can some one please help me fix it for Opera, IE, Mozilla.

For a moment working only for Chrome.

Upvotes: 2

Views: 85

Answers (1)

Erwin
Erwin

Reputation: 4817

You have to add the vendor prefixes for the browsers to your css like this:

.clr_bt {
    -webkit-transform: rotate(-50deg);
    -moz-transform: rotate(-50deg);
    -ms-transform: rotate(-50deg);
    -o-transform: rotate(-50deg);
    transform: rotate(-50deg);

    -webkit-transition: 0 .5s ease-in;
    -moz-transition: 0 .5s ease-in;
    -o-transition: 0 .5s ease-in;
    transition: transform .5s ease-in;
}
  1. webkit prefix is added for Chrome and Safari
  2. moz prefix is added for Firefox
  3. ms prefix is added for IE
  4. o prefix is added for Opera

Upvotes: 4

Related Questions