Cet utilitaire déplace un élément horizontalement et/ou verticalement sans modifier sa position dans le flux du document.
| Classe |
Styles |
| translate-<nombre> |
translate: calc(var(--spacing) * <nombre>) calc(var(--spacing) * <nombre>); |
| -translate-<nombre> |
translate: calc(var(--spacing) * -<nombre>) calc(var(--spacing) * -<nombre>); |
| translate-<fraction> |
translate: calc(<fraction> * 100%) calc(<fraction> * 100%); |
| -translate-<fraction> |
translate: calc(<fraction> * -100%) calc(<fraction> * -100%); |
| translate-full |
translate: 100% 100%; |
| -translate-full |
translate: -100% -100%; |
| translate-px |
translate: 1px 1px; |
| -translate-px |
translate: -1px -1px; |
| translate-(<propriete-personnalisee>) |
translate: var(<propriete-personnalisee>) var(<propriete-personnalisee>); |
| translate-[<valeur>] |
translate: <valeur> <valeur>; |
| translate-x-<nombre> |
translate: calc(var(--spacing) * <nombre>) var(--tw-translate-y); |
| -translate-x-<nombre> |
translate: calc(var(--spacing) * -<nombre>) var(--tw-translate-y); |
| translate-x-<fraction> |
translate: calc(<fraction> * 100%) var(--tw-translate-y); |
| -translate-x-<fraction> |
translate: calc(<fraction> * -100%) var(--tw-translate-y); |
| translate-x-full |
translate: 100% var(--tw-translate-y); |
| -translate-x-full |
translate: -100% var(--tw-translate-y); |
| translate-x-px |
translate: 1px var(--tw-translate-y); |
| -translate-x-px |
translate: -1px var(--tw-translate-y); |
| translate-x-(<propriete-personnalisee>) |
translate: var(<propriete-personnalisee>) var(--tw-translate-y); |
| translate-x-[<valeur>] |
translate: <valeur> var(--tw-translate-y); |
| translate-y-<nombre> |
translate: var(--tw-translate-x) calc(var(--spacing) * <nombre>); |
| -translate-y-<nombre> |
translate: var(--tw-translate-x) calc(var(--spacing) * -<nombre>); |
| translate-y-<fraction> |
translate: var(--tw-translate-x) calc(<fraction> * 100%); |
| -translate-y-<fraction> |
translate: var(--tw-translate-x) calc(<fraction> * -100%); |
| translate-y-full |
translate: var(--tw-translate-x) 100%; |
| -translate-y-full |
translate: var(--tw-translate-x) -100%; |
| translate-y-px |
translate: var(--tw-translate-x) 1px; |
| -translate-y-px |
translate: var(--tw-translate-x) -1px; |
| translate-y-(<propriete-personnalisee>) |
translate: var(--tw-translate-x) var(<propriete-personnalisee>); |
| translate-y-[<valeur>] |
translate: var(--tw-translate-x) <valeur>; |
| translate-z-<nombre> |
translate: var(--tw-translate-x) var(--tw-translate-y) calc(var(--spacing) * <nombre>); |
| -translate-z-<nombre> |
translate: var(--tw-translate-x) var(--tw-translate-y) calc(var(--spacing) * -<nombre>); |
| translate-z-px |
translate: var(--tw-translate-x) var(--tw-translate-y) 1px; |
| -translate-z-px |
translate: var(--tw-translate-x) var(--tw-translate-y) -1px; |
| translate-z-(<propriete-personnalisee>) |
translate: var(--tw-translate-x) var(--tw-translate-y) var(<propriete-personnalisee>); |
| translate-z-[<valeur>] |
translate: var(--tw-translate-x) var(--tw-translate-y) <valeur>; |
| translate-none |
translate: none; |
