title: How to create a ribbon shape in CSS
body: <p><a href="http://jsfiddle.net/6HyjZ/" rel="noreferrer">http://jsfiddle.net/6HyjZ/</a></p>
  
  <pre><code>.bookmarkRibbon{
       width:0; 
       height:100px; 
       border-right:50px solid blue;
       border-left:50px solid blue;
       border-bottom:30px solid transparent;
  }
  
  &lt;div class="bookmarkRibbon"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>I'm struggling to make a version of this shape where the ribbon is pointing right instead of down, 
  how can I achieve this?</p>