draw a triangle in css which have only borders

Question

I am trying to draw a triangle in css which contain only borders. no background colors.

.arrow {
border-bottom: 10px solid transparent;
border-top: 10px solid transparent;
border-right: 20px solid #000;
height: 0;
width: 0px;
}

The above code gives me a triangle with #000 as background colors. i just want the triangle borders.

Duplicate: http://stackoverflow.com/questions/16231184/create-a-triangle-with-css — dlock, Dec 04 '13 at 04:37
possible duplicate of [CSS triangle border](http://stackoverflow.com/questions/15110137/css-triangle-border) — Anthony, Dec 04 '13 at 04:39
The code you're using now [creates a triangle just fine](http://jsfiddle.net/k3x9w/)... — Nightfirecat, Dec 04 '13 at 04:44

score 1 · Answer 1 · answered Dec 04 '13 at 04:39

1

.arrow:after {
 content: '\25c1';
 display: inline-block;
}

answered Dec 04 '13 at 04:39

Patrick

will this have support across all browser? – Dec 04 '13 at 04:42
It's not going to work on lynx or anything, but generated content works great on most browsers - http://caniuse.com/#feat=css-gencontent – Patrick Dec 04 '13 at 04:49

1 Answers1