How to create a triangle in CSS3 using border-radius

Question

I am using border-radius property to acheive rounded corners. But I am not sure how to get rounded corners of this shape. I tried giving same dimensions from either sides bu

Answer 1

If I have understood your question properly. I think you can use something like below:

CSS:

#box{   border-color: transparent transparent transparent #FFFFFF;
    border-style: solid;
    border-width: 50px 0 50px 75px;
    height: 0;
    left: -40px;
    margin: 40px;
    position: absolute;
    width: 0;
}
 #outerbox{  background:red;
    height: 300px;
    position: relative;
    width: 122px;
}

HTML

LIVE DEMO

http://jsfiddle.net/fsGQR//