Deplasarea poziției cu translate-x- și translate-y- în Tailwind în Tailwind CSS

Deplasarea poziției elementului pe axa orizontală sau verticală fără a afecta poziția vecinilor.

Sintaxă
translate-x-4 | -translate-y-2 | translate-y-full

Ce sunt clasele translate- în Tailwind CSS

Funcția CSS translate(x, y) deplasează vizual un nod pe ecran. Combinată cu tranziții fluide, permite animarea glisării panourilor laterale (translate-x-full când este închis și translate-x-0 când este deschis) sau ridicarea ușoară a cardurilor la hover (hover:-translate-y-1).

Exemplu Concret: Efect de card ridicat la hover
<div class="bg-white p-6 rounded-xl shadow transition duration-200 hover:-translate-y-1 hover:shadow-lg">
  Card Interactiv
</div>

Comunitate & Schimb de cunoștințe

Întrebări & Exemple de Cod: Deplasarea poziției cu translate-x- și translate-y- în Tailwind

Ai o nelămurire despre utilizarea comenzii Deplasarea poziției cu translate-x- și translate-y- în Tailwind sau ai descoperit un truc / fragment de cod util? Distribuie-l cu ceilalți programatori!

💬

Fii primul care pune o întrebare sau distribuie un fragment de cod / prompt!

Nu au fost adăugate încă întrebări sau exemple de cod pentru această pagină. Dacă ai întâlnit o problemă sau ai un snippet util, adaugă-l mai jos pentru a-i ajuta pe ceilalți.

Comunitate Adaugă o întrebare sau distribuie un cod

Moderare & Siguranță:

Pentru a menține calitatea și securitatea informațiilor, fiecare întrebare sau fragment de cod/prompt este analizat (manual sau prin moderare asistată de AI) înainte de publicare.