Erstellen verschiedener Formen von Schaltflächen mit css3

Question

Ich habe Probleme mit der Herstellung von dreieckigen Knopf mit CSS und es ist Bit Buggy und wie kann ich es beheben?

eine Geige Es ist hier: https://jsfiddle.net/Adrianalings/jy11o85s

.btn { 
    position: fixed; 
    bottom: 50%; 
    height: 0px; 
    background-color:transparent; 
    border-top: 15px solid transparent; 
    border-left: 20px solid red; 
    border-bottom: 15px solid transparent; 
} 

Answer 1

Hier ist die Lösung =)

.btn { 
 

 
width: 0px; 
 
height: 0px; 
 
-webkit-transform:rotate(360deg); 
 
border-style: solid; 
 
border-width: 50px 0 50px 86.6px; 
 
border-color: transparent transparent transparent #C40006; 
 
background-color:transparent; 
 

 
}

<button class="btn"></button>