Can a fully functional arrow be created using CSS alone?
Here is the method I used to create just the arrowhead: http://jsfiddle.net/2fsoz6ye/
#demo:after {
content: ' ';
height: 0;
position: absolute;
width: 0;
border: 10px solid transparent;
border-top-color: #333;
}
However, I also need to include the rear part of the arrow. It should resemble this design:
Furthermore, I intend to rotate the CSS-arrow so that it can dynamically point in different directions such as top, left, or at a 45° angle...