title: Rounded arrows with CSS
body: <blockquote>
    <p><strong>Possible Duplicate:</strong><br>
    <a href="https://stackoverflow.com/questions/12041938/how-to-create-a-triangle-in-css3-using-border-radius">How to create a triangle in CSS3 using border-radius</a>  </p>
  </blockquote>
  
  
  
  <p>Are they possible to make with CSS?</p>
  
  <p>Normal arrow:</p>
  
  <pre><code>.some_element:after{      
    content: '';
    height: 0;
    width: 0;
    position: absolute;        
    top: 0;
    left: 0;       
    border: 100px solid transparent;
    border-top-color: #000;           
  }
  </code></pre>
  
  <p>( <a href="http://jsfiddle.net/W3xwE/" rel="nofollow noreferrer">http://jsfiddle.net/W3xwE/</a> )</p>
  
  <p>Rounded arrow (I want only the bottom side rounded):</p>
  
  <p><img src="https://i.stack.imgur.com/KWdz8.png" alt="enter image description here"></p>
  
  <p>:(</p>