This tutorial is a little more complicated. The idea with triangles in CSS is having a width and height defined by the CSS as , however, that doesn't consist of the borders. Borders are unaffected by width and height, giving you the ability to build triangles. The code (HTML): <div class="triangle"></div> The code (CSS): .triangle { width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 5px solid black; } Setting the border px width on all the borders will change the size of the triangle. To change the color of the triangle, simply change the color applied to the bottom border. You can manipulate that CSS to get the triangle you desire! Example: Enjoy
