Tuesday, February 17, 2015

CSS-only triangles



You can make a triangle with just CSS (just like the tiny triangle on Vimeo sidebar).



.triangle {
    width: 0;
    height: 0;
    border-top: 100px solid #0099ff;
    border-left: 100px dashed transparent;
    border-right: 100px dashed transparent;
    border-bottom: 0;
   display: block;
   overflow: hidden;
}


Demo: http://leplay.github.com/demo/tr...



View Source Code

No comments:

Post a Comment