Javascript 固定父对象内部的相对定位div

我需要相对定位div在固定父对象内

我有一个网站，所有东西都是相对例外的固定的弹出窗口，点击按钮即可打开。这个弹出窗口应该是100%宽度和100%高度，所以它覆盖了整个页面

在弹出窗口内，我希望左侧的固定的div为60%宽度，右侧的相对的div为40%宽度，自动高度，可以滚动

事实上，这很难解释，所以我做了小提琴。在本例中，我希望滚动橙色div而不是滚动蓝色div。是否可以更改滚动条焦点

<div id='container'>
  <div id='inside-fixed-div'>
    <div id='left-fixed-container'></div>
    <div id='right-relative-container'>
    </div>
  </div>
</div>

---

要删除蓝色卷轴，我需要删除

容器上设置的
1200px
高度，并用100%替换该值。除非父对象也是100%高度，否则100%高度将不起作用。因此，需要此100%高度的父级将是文档根和正文

html, body {
  margin: 0;
  height: 100%;
}

#container{
  ...
  height: 100%;
}

此外，我在
#右侧相对容器
上将溢出设置为自动，将高度设置为100%

#right-relative-container{
  ...
  height: 100%;
  overflow: auto;
  ...
}

结果（gif质量不好-抱歉）


演示
我只是想知道你用什么软件在Mac电脑上录制这些内容？（我在Chromebook上使用Techsmith Snagit，但我想知道你在使用什么，因为质量更好）谢谢。我喜欢！（它也在GPL下：D）这太棒了！谢谢：D