html - CSSで三角形を描く

Question

という事は承知しています

border-top: 50px solid transparent;

上の境界線の太さは 50px で、無地で色はありません。

それも理解してます

border-right: 100px solid red;

右の境界線が 100px の太さになり、実線で赤になります。

しかし、私は方法を理解していません...

#triangle-left 
{ width: 0; 
 height: 0; 
 border-top: 50px solid transparent;
 border-right: 100px solid red; 
 border-bottom: 50px solid transparent;} 

左向きの三角形は作れますか？

そして、理解を助けていただければ幸いです。