2017/06/29

Cross-browser flexbox input add-ons

Basado en Solvey by Flexbox: Input Add-ons, dando soporte a un mayor número de los navegadores más usados, según caniuse.com

Dado el marcado:

Aplicamos las variantes de display:flex con los prefijos de navegadores correspondientes:

Además, como UC Browser y Android Browser <=4.3 no lo aplican correctamente a elementos inline, aplicamos display:block

Estos navegadores no soportan display:flexbox, pero podemos hacer uso de display:table y display:table-cell para obtener un resultado similar. Hacemos uso de comentarios condicionales.

Probado en: