显示固定'模态'div时的页面移位

Question

所以我在backbone.marionette中构建了我自己的自定义模态框，但我遇到的问题是，每当我show()模态时，我的页面向下移动大约半英寸。很烦人。任何人都有想法如何解释或修复它？

这是我的#modal和.overlay css：

#modal {
    position: fixed;
    top: 0;
    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
    z-index: 1002;
    width: 70%;
}

.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.85);
    z-index: 1001;
}

Answer 1

找到一个解决方案 - 如果我将模态的top属性设置为0并给它一个margin-top的任何东西，那么就没有烦人的偏移。这是我登陆的最终css：

#modal {
    position: fixed;
    top: 0;
    left:0;
    right:0;
    margin-top: 2em;
    margin-left:auto;
    margin-right:auto;
    z-index: 1002;
    width: 70%;
}