This can be solved much easier than the other suggestions.
Simply draw a square and apply a border
property to just 2 joining sides.
Then rotate the square according to the direction you want the arrow to point, for exaple: transform: rotate(<your degree here>)
.triangle {_x000D_
border-right: 10px solid; _x000D_
border-bottom: 10px solid;_x000D_
height: 30px;_x000D_
width: 30px;_x000D_
transform: rotate(-45deg);_x000D_
}
_x000D_
<div class="triangle"></div>
_x000D_