Un valor ( end ) se define en la especificación de alineación de cuadro CSS y está destinado a aplicarse a varios modelos de diseño de cuadro (bloque, tabla, cuadrícula, flex, etc.)

El otro valor ( flex-end ) se define en la especificación CSS flexbox y está destinado a aplicarse solo al diseño flexible.

Con la especificación Box Alignment, el W3C intenta establecer un lenguaje universal para la alineación de cuadros en CSS. Eventualmente, los valores de alineación de caja reemplazarán los valores particulares definidos en flexión, cuadrícula y otras especificaciones.

Por ejemplo:

• end se usará en lugar de flex-end
• se usará column-gap en lugar de grid-column-gap
• y así.

Muchos valores de Alineación de cuadro ya están en uso en los principales navegadores. Pero la implementación completa aún está lejos, por lo que aún es más seguro usar flex-end en lugar de end (y luego contar con soporte a largo plazo para nombres heredados).

Aquí hay una ilustración de la especificación Box Alignment:

§ 8.3. Legacy Gap Properties: las propiedades grid-row-gap , grid-column-gap y grid-gap

El módulo Diseño de cuadrícula se escribió originalmente con su propio conjunto de propiedades de medianil, antes de que todas esas propiedades se unificaran en la nomenclatura de espacio row-gap column-gap . Para la compatibilidad con el contenido heredado, esos nombres de propiedad heredados deben admitirse como alias:

• grid-row-gap debe tratarse como una abreviatura de la propiedad row-gap

• grid-column-gap debe tratarse como una abreviatura de la propiedad column-gap

• grid-gap debe tratarse como una abreviatura de la propiedad gap

En los tres casos, las propiedades heredadas deben adoptar la misma gramática que la propiedad a la que están creando un alias y simplemente "reenviar" el valor a su propiedad con alias.