How to cut corner of any element in CSS

Div Cropping Using CSS

In web designing some time you need to crop your container/div/element of html page by its corner. Here you will learn how can we do that step by step by using HTML and CSS

CSS Code:
 
div
{
    background-color:#1979CA;
    position:relative;
    color:white;
}

div:before{
    content: '';
    position: absolute;
    top:120px; right: 0;
    border-bottom: 80px solid white;
    border-left: 675px solid #1979CA;
    width: 0;
}
div:after{
    content: '';
    position: absolute;
    top:120px; left: 0;
    border-bottom: 80px solid white;
    border-right: 675px solid #1979CA;
    width: 0;
}
 
Note: You can change div to your any element in HTML.  



Best Book for Entrepreneur ==> Strategies To Build Successful Web Agency