3D perspective

by agib

HTML

<div class="container"><div class="box"></div></div>

CSS

body {
    padding: 100px;
}

.container
{
        perspective: 750px;
        -moz-perspective: 750px;
        -ms-perspective: 750px;
        -o-perspective: 750px;
        -webkit-perspective:750px;
 
        transform-style: preserve-3d;
        -moz-transform-style: preserve-3d;
        -ms-transform-style: preserve-3d;
        -o-transform-style: preserve-3d;
        -webkit-transform-style: preserve-3d;
}
.box
{
        width: 300px;
    height: 300px;
    background-color: lightblue;
    transform: rotate3d(0,1,0,45deg);
    -moz-transform: rotate3d(0,1,0,45deg);
    -ms-transform: rotate3d(0,1,0,45deg);
    -o-transform: rotate3d(0,1,0,45deg);
    -webkit-transform: rotate3d(0,1,0,45deg);
 
}