Cómo restablecer CSS3 * - transform: translate (translate)?


¿Cómo se supone que debo restablecer las transformaciones CSS aplicadas anteriormente?

Digamos que tengo:

div.someclass {
    -webkit-transform: translate3d(0, -50%, 0);
       -moz-transform: translate(0, -50%);
        -ms-transform: translate(0,- 50%);
         -o-transform: translate(0, -50%);
            transform: translate3d(0, -50%, 0);
}

Entonces, ¿cómo borro todas las transformaciones/traducciones?


Debo usar: translate(0, 0); / translate3d(0, 0, 0); o transform:auto; ?

Author: Zuul, 2011-10-17

2 answers

Según la documentación MDN , el valor inicial es none.

Puede restablecer la transformación usando:

div.someclass {
    transform: none;
}

Usando el prefijo del proveedor:

div.someclass {
    -webkit-transform: none; /* Safari and Chrome */
       -moz-transform: none; /* Firefox */
        -ms-transform: none; /* IE 9 */
         -o-transform: none; /* Opera */
            transform: none;
}
 80
Author: Simone,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2013-04-12 13:01:07

En Safari iOS 10.3 y 11.0 y Safari 11 en macOS no restablecieron la transformación correctamente con-webkit-transform: none; o transform: none; Tuve que restablecer todos los valores que cambié con la propiedad transform, así que esencialmente creo que la primera opción

translate(0, 0); / translate3d(0, 0, 0);

Es el camino a seguir para la compatibilidad del navegador por ahora. Así que esto DEBERÍA funcionar:

-webkit-transform: translate(0, 0) translate3d(0, 0, 0);
-moz-transform: none;
-ms-transform: none;
-o-transform: none;
transform: translate(0, 0) translate3d(0, 0, 0);
 1
Author: Brandito,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-11-20 22:30:54