How to make Parallelogram shaped background by CSS3.

CSS3 is awesome to make interesting style of web-pages. This is the tutorial about How to make Parallelogram shaped background by CSS3. You may do it by different ways but I’m showing the way which I prefer.

.the-class{
display: block;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
float: none;
z-index: auto;
width: 100px;
height: 100px;
overflow: hidden;
-o-text-overflow: clip;
text-overflow: clip;
background: red;
-webkit-transition: none;
-moz-transition: none;
-o-transition: none;
transition: none;
-webkit-transform: skewX(-13deg);
transform: skewX(-13deg);
-webkit-transform-origin: 50% 50% 0;
transform-origin: 50% 50% 0;
}

Enjoy the awesome shape.