Can't get coordinates of html element

Question

I tried to get the coordinates of Block-1 and scroll the page to it, but I did something wrong =( How to get the html coordinates of the Block-1 element and scroll the page to it?

let elem = document.querySelector('.Block-1');
let coords = elem.getBoundingClientRect();
elem.style.top = coords.bottom + 'px';


window.scrollTo({
  top: elem,
  behavior: "smooth"
});

.Block-1 {
  margin-top: 500px;
  border: 1px solid black;
  font-size: 30px;
  padding: 50px;
}

<div class="Block-1">

  Scroll here

</div>

Answer 1

You where on the right track. The top property of the scrollTo() is the top property of the getBoundingClientRect(). So, top: coords.top.

let elem = document.querySelector('.Block-1:nth-child(2)');
let coords = elem.getBoundingClientRect();

window.scrollTo({
  top: coords.top,
  behavior: "smooth"
});

.Block-1 {
  margin-top: 500px;
  border: 1px solid black;
  font-size: 30px;
  padding: 50px;
}

<div class="Block-1">

  Not here

</div>

<div class="Block-1">

  Scroll here

</div>

<div class="Block-1">

  Not here

</div>