Reply To: Perspective not working when transformation applied to img in firefox or ie10?

[Designer42]

Have you tried for MOZ. ‘-moz-transform: skewx(XXpx)’, Perspective should work. IE10 is not working because you don’t have anything for -MS.

Here try this. I took your Codepen code and did some changes. Look at putting all the transform properties on your image, not the wrapping div. Keep messing with the numbers until you get the desired effect.

Tested on Firefox, Chrome and IE9

    body {
        width: 960px;
        margin: 100px auto;
     }
    .slider {
        position: relative;
     }
     .sliced {
        position: absolute;
     }
    .sliced img{
transform: perspective(500px) rotateX(73deg) rotateZ(0deg) skewX(-30deg); 
     -webkit-transform: perspective(500px) rotateX(73deg) rotateZ(0deg) skewX(-30deg); 
 }