Javascript 如何使对话框覆盖整个屏幕？

我正在学习这个有角度的灯箱教程。当我将按钮放在div中时，灯箱只会扩展到div的大小。我的代码如下所示：

<div class='newPen'>
  <div ng-app='mean.items' ng-controller='MyCtrl'>
    <button ng-click='toggleModal()'>Open Modal Dialog</button>
    <modal-dialog show='modalShown' width='1000px' height='1000px'>
      <p>Modal Content Goes here<p>
    </modal-dialog>
  </div>
</div>

打开模态对话框
模态内容在此显示

但是lightbox只显示在div中。如何使我的lightbox显示在整个页面上

如果你需要更多信息，请告诉我

编辑：

---

这是我做的一份报告。在本例中，由于位置绝对，模型框变得混乱。问题是在我的代码中我有一堆css位置绝对。。。那么，在保持父div的绝对位置的同时，我是否可以使模式框覆盖整个屏幕？

尝试将其添加到css中

.ng-modal-dialog {
  width: 100% !important;
  height: 100% !important;
}

---

希望这有帮助…………

你能创建一个小提琴吗？试着在脚本本身中设置你的模态大小…我不能重新创建你的问题，可能包括你的CSS或提供一个小提琴来重新创建你的问题。