CSS transformer l'inclinaison, comment rendre l'image supérieure horizontale?

Question

La question est: comment faire .box2 image top horizontal, comme le premier .box div?

Voir la Fiddle: http://jsfiddle.net/PArPj/2/

.box2{ 
    height:600px; 
    width: 300px; 
    overflow:hidden; 
    -ms-transform:skewY(-20deg); /* IE 9 */ 
    -moz-transform:skewY(-20deg); /* Firefox */ 
    -webkit-transform:skewY(-20deg); /* Safari and Chrome */ 
    -o-transform:skewY(-20deg); /* Opera */ 
    transform:skewY(-20deg); 
    float: left; 
} 

.box2 img { 
    height: 600px; 
    width: 300px; 
    -ms-transform:skewY(-20deg); /* IE 9 */ 
    -moz-transform:skewY(-20deg); /* Firefox */ 
    -webkit-transform:skewY(-20deg); /* Safari and Chrome */ 
    -o-transform:skewY(-20deg); /* Opera */ 
    transform:skewY(-20deg); 

    -ms-transform-origin: 100% 100%; /* IE 9 */ 
    -webkit-transform-origin: 100% 100%; /* Safari and Chrome */ 
    -moz-transform-origin: 100% 100%; /* Firefox */ 
    -o-transform-origin: 100% 100%; /* Opera */ 
    transform-origin: 100% 100%; 

} 

Answer 1

Utilisez transform:rotate(35deg) skewY(-20deg);