Ciao a tutti
Sto avendo un problema con la posizione di un elemento nonostante io gli dia la posizione esatta, mi spiego, creo un elemento in javascript:

codice:
const padre = document.querySelector(".box-padre");
const el = document.createElement("span");
el.setAttribute("class","preloader");
padre.appendChild(el);

Ora il CSS:
codice HTML:
.box-padre {
position:relative;
width: 100%;
height: 100%;
}
.preloader {
position: absolute;
z-index: 1;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
...
}
ecco quello che non prende è il translate mi sapreste dire il perchè?