$hikiryu->devblog(); : The curious developper's blog

CSS triangles

• CSS

   - 05/01/2011 | 0 comment(s)

I didn't know you could do triangles with CSS without images and no additional markup. How to do it ?

.css-arrow-multicolor {
  border-color: red green blue orange;
  border-style:solid;
  border-width:20px;
  width:0;
  height:0;
}

Colors can be replaced by "transparent" to make a unique triangle. The border size can change to make acute triangles and changing "style" can lead to interesting results.

cf :  http://www.dinnermint.org/blog/css/creating-triangles-in-css/ via http://cssglobe.com/post/9435/pure-css3-post-tags

---