Use transições CSS3 com fundos gradientes

Estou tentando fazer a transição ao passar o mouse com css sobre uma miniatura, para que, ao passar o mouse, o gradiente de segundo plano diminua. A transição não está funcionando, mas se eu simplesmente a alterar para um valor rgba (), ela funcionará bem. Gradientes não são suportados? Também tentei usar uma imagem, mas ela também não fará a transiçã

Eu sei que é possível, como em outro post alguém fez isso, mas não consigo descobrir exatamente como. Qualquer ajuda> Aqui está um CSS para trabalhar:

#container div a {
  -webkit-transition: background 0.2s linear;
  -moz-transition: background 0.2s linear;
  -o-transition: background 0.2s linear;
  transition: background 0.2s linear;
  position:absolute;
  width:200px;
  height:150px;border: 1px #000 solid;
  margin:30px;z-index:2
}
#container div a:hover {
  background:-webkit-gradient(radial, 100 75, 100, 100 75, 0, from(rgba(0,0,0,.7)), to(rgba(0,0,0,.4)))
}

questionAnswers(15)

yourAnswerToTheQuestion