设置溢出：自动，但不显示水平滚动条

Question

为什么不用id“shouldHaveScrollBar”的div不显示水平滚动条：

<div style="overflow:hidden; 
            width: 300px; height: 300px; background-color:blue; color:white">

    <div>Some stuff</div>
    <div>Some other stuff"</div>
    <div id="shouldHaveScrollBar" 
         style="background-color:grey; 
                width: 100%; height: 100%; overflow-x:auto">
      <input type="text" size=200">
    </div> 
</div>

谢谢，

Answer 1

因为你的水平滚动条隐藏在y溢出中。

shouldHaveScrollBar设置为100％高度，这是其父级的100％，因此它的高度为300px。不幸的是，其他2个div“Some stuff”等将其推下来，这意味着底部的滚动条被父div的overflow:hidden隐藏。

将shouldHaveScrollBar的高度更改为50％，您将看到我的意思。在这种情况下，您的身高应该是固定的像素高度而不是百分比，或者您的其他div需要设置为百分比，以使您的子div的总数<= 100％。