Question

我正在做一个弹出窗口，当一个人将产品添加到他们的购物车时，但我有一个问题，使其响应。

问题是当用户浏览器的高度小于弹出窗口时，overflow css属性会添加滚动功能（这就是我想要的），但它也会在内部添加自己的宽度弹出窗口，导致一个产品下移到下一行。我想要一种方法将滚动条一直添加到右侧（因此它看起来像普通的页面滚动条）。

我在这里做了一个简化的例子：http://codepen.io/Mathias_/pen/oLyVQj （问题不在于白盒dosn覆盖了enitre产品，但当你使浏览器高度变小时，一个产品移到下一行）

Answer 1

我修好了codepen

我将overflow:auto添加到您的.bottom-box课程。

Answer 2

请检查一下： enter code here http://codepen.io/anon/pen/bZKJgx 我不确定，但可能填充少量可能有帮助吗？我设置了10px。

Answer 3

您也可以只使用coordonates来调整弹出窗口的大小。 （身高：100％+顶部：15px;坐在窗户里太多了）

用这个更新你的弹出式CSS并测试它

.popup {
    position: fixed;
    left: 50%;
    top: 15px;
    display: block;
    width: 830px;
    bottom:15px;/* or 0 or whatever */
    margin-left: -415px;
    z-index: 16000004;
    overflow: auto;
}

DEMO

阻止滚动条干扰的最佳方法

3 个答案: