MicroPosts

• Horizontally scroll to center an element

  <div class="width-full overflow-x-auto">
    <div>...</div>
    <div>element</div>
    <div>...</div>
  </div>
  

  const viewportWidth =
    Math.max(document.documentElement.clientWidth, window.innerWidth || 0)
  
  container.scrollLeft =
    element.offsetLeft // scroll to the left edge of element
    + element.offsetWidth / 2 // scroll to center of element
    - viewportWidth / 2 // scroll back half the viewport