-webkit-transform does not work in Android web browser

I applied the following css to the image in the span tag.

-moz-transform: rotate(-2deg);
-webkit-transform: rotate(-2deg);
transform:rotate(-2deg);
-o-transform: rotate(-2deg);

this css style works on ios web browser, desktop browser but not on android web browser which is also based on web whales.

My question is why this is not displayed on Android.

+5
source share
3 answers

I am using Android version 3.1 and this code works fine for me .. my code is below

.transofmr
{
-ms-transform: rotate(30deg); /* IE 9 */
-webkit-transform: rotate(30deg); /* Safari and Chrome */
-o-transform: rotate(30deg); /* Opera */
-moz-transform: rotate(30deg); /* Firefox */
transform: rotate(30deg);

width:200px;
height:200px;
background-color:#339933;
}
<div class="transofmr">Transform</div>
+4
source

AFAIK, the rotation transform applies only to block level elements. By default, an element is an inline element.

+5
source

this will help u .. i tested this on a Motorola XOOM device.

.transofmr
{
transform: rotate(30deg);
-ms-transform: rotate(30deg); /* IE 9 */
-webkit-transform: rotate(30deg); /* Safari and Chrome */
-o-transform: rotate(30deg); /* Opera */
-moz-transform: rotate(30deg); /* Firefox */
}
0
source

All Articles