eu tenhoum rectângulo onde cada lado da diagonal tem sua própria cor

div {
    width: 0;
    height: 0;    
    border-left: 150px solid green;
    border-top: 100px solid gray;
}

Agora eu queria adicionar um raio de borda à div, mas notei que isso funciona bem para todos os lados, exceto para o canto inferior esquerdo.

Então, se eu adicionar:

border-radius: 10px 10px 10px 0;

eu receboesta:

.. mas assim que adiciono um raio de borda inferior esquerdo, receboesta:

1) Por que isso acontece?

2) Existe uma solução fácil?

Editar:

Estou usando o Chrome, mas parecia um firefox e IE e os resultados são diferentes!

Raposa de fogo:

IE 11

O que está acontecendo?