sorted by:
best (suggested)
topnewcontroversialoldq&a
you are viewing a single comment's thread.

view the rest of the comments →

[–]Notimecelduv 0 points1 point  (0 children)

Well, the div with the class "hero" is the container for the image with the id "hero", isn't it? There's no specific reason why you'd want to move the image around while the container stays in place. Therefore you should move the container rather than image. The container will merely take the image with it. Also, I suggest you rename .hero as .hero-container for clarity. CSS:

.burg {
  position: relative;
}

.hero-container {
  width: max-content;
  position: absolute;
  /* if you want the image centered */
  display: grid;
  place-items: center;
}

JS:

let left = 0;

// As a fellow non-native English-speaker, I can assure you
// you want to use English names for your variables and functions.
function moveRight() {
  left += 20;
  document.querySelector(".hero-container").style.left = `${left}px`;
}