title: CSS Slaint edges on bootstrap menu
body: <p>I am trying to create <a href="http://s16.postimage.org/6xshxdzhx/menu.png" rel="nofollow">this</a> in bootstrap with a menu, how would i get those slant edges in css?</p>
  
  <p>Here's a <a href="http://jsfiddle.net/dawidvdh/BWM8c/" rel="nofollow">JsFiddle</a> so far i have gotten one corner to be slanted, but i just cant seem to get another in the opposite direction.</p>
  
  <p>Here's CSS i used for the on Edge:</p>
  
  <pre><code>    .navbar .nav {
          float: right;
          right: 0;
  /*Slant Edges*/
          height:0;
          border-bottom: 40px solid #000;
          border-right: 40px solid white;
  /*Slant Edges*/
      }
  </code></pre>
  
  <p>Any Help Greatly Appreciated.</p>