放置孩子时如何拖动父元素？

Question

我试图定位一个元素，在这种情况下为div，但我不想基于其自身定位，而是基于子元素定位。我想在屏幕上将该子元素居中放置，但我也希望它的父元素与之一起移动，以便它的子元素不会失去其相对于父元素的位置。这有任何意义吗？这是一个希望可以使事情变得更加清晰的图表：http://imgur.com/gallery/SJEBizz

这甚至有可能做到吗？如果是这样，请帮帮我！

Answer 1

main {
  background: white;
  height: 300px;
  margin: 20px auto;
  width: 300px;
  position: relative;
}

main div {
  position: absolute;
  top: 50%;
  left: 20px;
  right: 20px;
  background: black;
  color: white;
  padding: 20px;
  transform: translateY(-50%);
  resize: vertical;
  overflow: auto;
}