[ CSS3 ] 一つのdivで菱型を作る

.hishigata{
width:0px;
height:0px;
border-top:15px solid transparent;
border-left:0px solid transparent;
border-right:30px solid #000000;
border-bottom:15px solid transparent;
-webkit-box-reflect:right;
}

<div class="hishigata"></div>

「-webkit-box-reflect:right;」で、描写した三角形を反面コピー表示することができます。