Estoy tratando de centrar verticalmente los elementos con flexbox de CSS; y, sé cómo hacerlo con el código sin prefijo de proveedor, pero incluso con los prefijos de proveedor no puedo hacer que funcione en Webkit (Chrome).

Estoy tratando de alinear verticalmente los tramos en #trigger.

Aquí está mi CSS:

#trigger{
    /* 2009 syntax */
    display: -webkit-box;
    display: box;
    /* current syntax */
    display: -webkit-flex;
    display: flex;
}

#trigger span{
    /* 2009 syntax */
    -webkit-box-align: center;
    /* current syntax */
    -webkit-align-items: center;
    flex-align: center;
}

¿Alguna idea de lo que estoy haciendo mal?

Y si conoce los prefijos / versiones de otros proveedores de las propiedades que estoy usando, no dude en compartirlas para que esto funcione en más que solo Webkit.