title: Making position: sticky work for 100% of page height (not just viewport height)
body: <p>I'm working on a page that is, essentially, an article template. The article has a social sharing feature on it--facebook, twitter, email, print, etc. That container, we'll call it the Social Share container, needs to be sticky when the user scrolls.</p>
  <p>I currently have the solution only partially working. I can get the container to be sticky for 100vh, but when the height of the viewport scrolls off screen, the container's height is exceeded and the container stops being sticky (it has hit the bottom of it's containing element's height).</p>
  <pre><code>.parent-element {
  height: 100vh;
  position: absolute;
  display: block (user style sheet);
  }
  .sticky-element {
  position: sticky;
  top: 0;
  align-items: start;
  display: flex;
  flex-direction: column;
  }
  .sticky-children {
  align-self: flex-start;
  }
  </code></pre>