css shapes - how to create Hollow triangle in css -

this question has answer here:

• create triangle css? 6 answers

i want create hollow triangle css don't how hollow that. can create triangle css have 1 problem , is: can't hollow triangle.

this code:

html:

<div id="tringle"></div> 

css:

#tringle {   position: absolute;   height: 0;   width: 0;   top: 50%;   left: 7px;   border-left: 7px solid transparent;   border-right: 7px solid transparent;   border-top: 7px solid white; } 

not cross-browser works. hope i've understood request.

http://jsfiddle.net/wmdnr/3/

 .triangle {       position: relative;      width: 20px;      margin-top: 100px;  }  .triangle>div {       width: 20px;      height: 2px;      background: red;      margin-top: 100px;  }   .triangle>div:before {      content: " ";      display: block;      width: 20px;      height: 2px;      background: red;      -webkit-transform: rotate(56deg);      -moz-transform: rotate(56deg);      -ms-transform: rotate(56deg);      transform: rotate(56deg);      position: absolute;      top: -8px;      right: -5px;  }  .triangle>div:after {      content: " ";      display: block;      width: 20px;      height: 2px;      background: red;      -webkit-transform: rotate(-56deg);      -moz-transform: rotate(-56deg);      -ms-transform: rotate(-56deg);      transform: rotate(-56deg);      position: absolute;      top: -8px;      left: -5px;  }