CSS Cross Shape

It's surprising to see how helpful the CSS Shapes are. These shapes help us in many many ways. If you look at the image below you will say you have to use full image for this effect, because background-repeat wont work in this situation.

 To avoid use of images for such designs we can use CSS Shapes and the web would be light-weight and full of fun. Here is the CSS that creates above shape and works in all browsers including IE.

.cssCrossShape{
    margin: 100px 0 0 100px;
    border-color:#3274D0;
    border-style: solid;
    border-width:150px 1100px;
    border-top:90px solid transparent;
    border-left:0px solid transparent;
    height:0;
    width:0;
}

<div class="cssCrossShape"></div>