Faire son site 11 : Référence CSS - translatey()

translatey()

La fonction translatey() permet de déplacer un élément verticalement. Cette transformation est caractérisée par une longueur qui définit l'amplitude du mouvement vertical.

La notation translatey(ty) est une notation abrégée pour translate(0, ty).

- tx représente l'ordonnée du vecteur de translation.


<style>
.fond {
  width: 200px;
  height: 300px;
  border: 1px dotted black;
}
.rect {
  width: 120px;
  height: 120px;
  background-color: deepskyblue;
}
.rect#trans {
  transform: translatey(280px);
}
</style>
<div class="fond">
  <div class="rect"></div>
</div>
<br>

<div class="fond">
  <div class="rect" id="trans"></div>
</div>