Abreviatura de transición CSS con múltiples propiedades?

Parece que no puedo encontrar la sintaxis correcta para la transición CSS abreviación con múltiples propiedades. Esto no hace nada:

.element {
  -webkit-transition: height .5s, opacity .5s .5s;
     -moz-transition: height .5s, opacity .5s .5s;
      -ms-transition: height .5s, opacity .5s .5s;
          transition: height .5s, opacity .5s .5s;
  height: 0;
  opacity: 0;
  overflow: 0;
}
.element.show {
  height: 200px;
  opacity: 1;
}

Agrego la clase show con javascript. El elemento se vuelve más alto y visible, simplemente no hace transición. Pruebas en la última Chrome, FF y Safari.

¿Qué estoy haciendo mal?

EDITAR: Solo para ser claro, estoy buscando la versión abreviada para escalar mi CSS hacia abajo. Está bastante hinchado con todos los prefijos de los vendedores. También expandió el código de ejemplo.