[CSS] CSS로 삼각형 그리기

CSS로 위 이미지처럼 깃발의 꼬리 부분 처럼 삼각형 만드는 방법은 다음과 같다

<div class="flag-tail"></div>

.flag-tail {
    border-color: red red transparent red;
    border-style: solid;
    border-width: 0px 150px 150px 150px;
    height: 0px;
    width: 0px;
    position:absolute;
}