为什么我看不到滚动条的底部

Question

我的滚动条底部有问题，没有向下箭头。

我还添加了 Overflow-y:scroll !important;

http://jsfiddle.net/nzguLb3k/

超文本标记语言

<div class="first">
    <p>
        CSS image replacement is a technique of replacing a text element (usually a header tag like an <h1></h1>) with an image (often a logo). It has its origins in the time before web fonts and SVG. For years, web developers battled against browser inconsistencies to craft image replacement techniques that struck the right balance between design and accessibility.

Now that web fonts and SVG do much more of the heavy lifting for stylized text on the web, these techniques are falling out of use. But, we feel it's worth preserving them in this museum to celebrate the ingenuity that went into their creation, and to remind ourselves of a bygone era in web design.
        CSS image replacement is a technique of replacing a text element (usually a header tag like an <h1></h1>) with an image (often a logo). It has its origins in the time before web fonts and SVG. For years, web developers battled against browser inconsistencies to craft image replacement techniques that struck the right balance between design and accessibility.

Now that web fonts and SVG do much more of the heavy lifting for stylized text on the web, these techniques are falling out of use. But, we feel it's worth preserving them in this museum to celebrate the ingenuity that went into their creation, and to remind ourselves of a bygone era in web design.
    </p>

</div>
<div class="second">
   Now that web fonts and SVG do much more of the heavy lifting for stylized text on the web, these techniques are falling out of use. But, we feel it's worth preserving them in this museum to celebrate the ingenuity that went into their creation, and to remind ourselves of a bygone era in web design.
</div>

CSS

.first{
    display:inline-block;
    vertical-align:top;
    width:100px;
    height:1000px;
    overflow-y:scroll !important;
}
.second{
    margin-left:100px;
    display:inline-block;
    vertical-align:top;
     width:100px;
    height:100px;
}
body{
overflow-y:hidden;
}

Answer 1

底部的箭头就在那里，只是你看不到它，因为它在窗外。窗户本身（通过主体设计）具有overflow:hidden.

解决方案：不要应用于overflow:hidden正文，而是将其应用于第二个 div（至少，正如我推测的，它不应该有滚动条）。

我还需要应用于heighthtml 和 body，以确保它们与窗口一样高。

新小提琴：http://jsfiddle.net/nzguLb3k/1/

（请注意，仅当保留边距时才需要计算主体高度；否则它只能是 100%。）