Html 滚动条可见，可以'；卷轴

我有下面的HTML（这里演示：），它有一个内部DIV，ID为

tabs

：

<div data-role="page">
    <div id="header"></div>
    <div id="content">
        <div id="tabs">
            <div id="j1">
                <div class="letter">
                    <p>Section 1</p>
                </div>
            </div>
            <div id="j2">
                <div class="letter">
                    <p>Section 2</p>
                </div>
            </div>
            <div id="j3">
                <div class="letter">
                    <p>Section 3</p>
                </div>
            </div>
            <div id="j4">
                <div class="letter">
                    <p>Section 4</p>
                </div>
            </div>
        </div>
    </div>
    <div id="popup-container">
        <div id="popup">
            <div id="pheader">
                <a id="close-popup"></a>
            </div>
        </div>
    </div>
</div>

我的内容容器包含四个框，如果缩小窗口高度，您将看到它们被隐藏，这是所需的行为

然而，我需要这个container div来滚动——它显示了滚动条（在Windows上）——它看起来大约是正确的高度，但实际上并没有滚动。有什么想法吗

---

它被绑定到屏幕边缘的原因是因为它是一款移动应用程序，可以在多种屏幕尺寸上运行。

我删除了溢出：auto；然后我就可以在你的页面上滚动了。当你添加这个函数时，有一些东西使它卡住了

.hub #content {
    top: 40px;
    padding-top: 30px;
    bottom: 45px;
    background: #fff;
    width: 100%;
    overflow: auto;

但我真的不能告诉你为什么它卡在你使用溢出。应该行得通

已编辑：尝试从以下位置检查Css：

.hub #header, .hub #content, .hub #popup-container {
    font-size: 1.3em;
    /* font-variant : small-caps; */
    position: absolute;
}

到

---

这为我解决了滚动问题

解决了它。我删除了以下几行：

.hub ui-page, .hub .ui-body-c,
.ui-overlay-c ui-page, .ui-overlay-c .ui-body-c,
.ui-mobile-viewport ui-page, .ui-overlay-c .ui-body-c {
    z-index: -2;
}

并改变了：

.hub #content {
    z-index: -1;
}

致：

---

我不认为它喜欢负z指数，冒昧猜测。

我认为你对z指数的看法是正确的，但造成这种情况的不仅仅是负值

我只是遇到了同样的问题（谢谢你给我指出了正确的方向）

---

在我的例子中，div上根本没有z索引集。设置一个正的z-index为我解决了这个问题。

是的，我也发现了-但是如果你再看看我的内部div，它不符合

bottom:45px

的规则。用一个可行的解决方案更新。

.hub ui-page, .hub .ui-body-c,
.ui-overlay-c ui-page, .ui-overlay-c .ui-body-c,
.ui-mobile-viewport ui-page, .ui-overlay-c .ui-body-c {
    z-index: -2;
}

.hub #content {
    z-index: -1;
}

.hub #content {
    z-index: 1;
}