Bootstrap popover arrow correction when rounded corners are removed
<p>I have setup a Bootstrap 3 popover design <a href="http://www.bootply.com/3oMRwFiqxn" rel="nofollow">here</a>.</p>

<p>I have removed the border-radius with this code:</p>

<pre><code>.popover {
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    max-height: 50%;
    overflow-y: auto;
}
</code></pre>

<p>This resulted in the arrow disappearing from view. I want to retain the arrow. Tried a lot of solutions offered here but couldn't get it right. How can I correct my code?</p>