jueves, 24 de diciembre de 2015

CSS para Firefox 37

 



La mayoría de programadores principiantes o intermedios al momento de maquetear un proyecto web realizamos las pruebas en navegadores como Chrome y Firefox (En versiones actualizadas),  y siempre fue un dolor de cabeza ver que te ha tomado tiempo para que tu proyecto se vea bien en estos navegadores que cuando probamos en IE (Internet Explore) en sus versiones anteriores estos css no sirvieron en absoluto para IE.

Sin embargo en esta oportunidad no he venido hablar de IE, de lo contrario de Firefox en su versión 37. ¿Porqué hago esto?, En estos últimos días me ha tocado "meter mano" de lado front. la maquetación se veía bien tanto en Chrome, Firefox, Safari, Opera, Android, iOS, pero el requerimiento del cliente fue que en Firefox en versión 37 algunos elementos estaban des alineados y me tomó mucho tiempo encontrar la "tic" para la solución.

Así que ahora, para facilitarte la vida compartiré las tics CSS.

Para programar Estilos CSS en Firefox 37 en adelante, solo deberás colocar lo siguiente:

/**** ... a continuación de tu código css ****/
@supports (-moz-appearance:none) and (display:contents) {
 /**** aquí tus nuevos estilos ****/
}

Si quieres estilos específicamente para Firefox 37:
/**** ... a continuación de tu código css ****/
@supports (-moz-appearance:none) and (display:contents)  and (not (ruby-position:over)){
 /**** aquí tus nuevos estilos ****/
}

Esto es lo que deberías agregar a tus Estilos CSS y evitarte el dolor de cabeza.
Comparte para ayudar a otros programadores.

No hay comentarios:
Write comentarios