title: How to make CSS triangles (with borders) compatible across browsers
body: <p>I was able to create a neat pointy flow-chart, as shown here: <a href="http://jsfiddle.net/R8Gx3/3/" rel="nofollow">http://jsfiddle.net/R8Gx3/3/</a></p>
  
  <p>However, the rendering is not consistent across the major browsers (Chrome, Firefox, IE).</p>
  
  <p>Any thoughts on how to achieve this same effect but in a more reliable way?</p>
  
  <p>Obviously I could use images, but I prefer CSS wherever possible since it's easier to edit colors in CSS (rather than create new images).</p>
  
  <p>I can't just use a triangle character since there is a textured background behind the elements, so I need transparency.</p>