html - 当屏幕尺寸发生变化时，如何将按钮位置固定在 div 的内部？

Question

似乎无法理解。我有一个 div，它使用 vw 和 vh 单元进行响应，我试图让一个按钮留在右下角div 与屏幕尺寸无关。

但是，随着浏览器窗口大小的改变，按钮会移入和移出父 div。我该如何解决这个问题？

#flexiblediv {
  width:50vw;
  height:50vw;
  background-color:red;
  margin-left:50px; 
}
#insidediv {
  height:45vh; /* I need this div, not sure what units to use with it. */
}
#testbutton {
  float:right;
}

<div class="row" id="flexiblediv">
  <div id="insidediv"></div>
  <button id="testbutton"> Test</button>
</div>

jsfiddle

Answer 1

非常简单:

#flexiblediv
{
   position:relative;
}
#testbutton
{
    position:absolute;
    right:0px;
    bottom:0px;
}