如何使滚动条不被覆盖

Question

我有一个名为BasePanel的基本面板，其代码无法更改。 我有一个总是固定高度的栏，这个栏没有添加到BasePanel中，但它与BasePanel重叠。 我还有一个名为Container的面板，它被添加到BasePanel中。 Panel Container应位于Bar下方。

现在我想要在更改窗口大小时，Panel Container可以自动显示滚动条，我已经实现但有问题。问题是，当窗口变小时，滚动条的一部分将被覆盖。我想知道如何解决这个问题？

BasePanel {
    width: 100%;
    height: 100%;
    position:fixed;
    font-family: 'Arimo';
}


Bar{
    height: 41px;
    width: 100%;
    z-index: 9998;
    position: fixed;
    top: 0px;
}


.Container{
    width: 100%;
    height: 95.570321151%;
    top: 4.429678848%;
    overflow: auto;

}

如果我将容器的顶部设置为百分比，滚动条的向上箭头将被条形图覆盖。

.Container{
    width: 100%;
    height: 95.570321151%;
    top: 41px;
    overflow: auto;

}

如果我将容器的顶部设置为41px，滚动条的向下箭头将被覆盖，因为没有足够的空间。

换句话说，我想知道如何让Panel Container始终从顶部41px开始，无论窗口大小如何变化，Container都不会从BasePanel溢出，因此滚动条将会没有被覆盖（请记住Bar不在BasePanel中）？

Answer 1

我弄明白该怎么做。 只需使用calc（）函数设置容器面板高度。

如calc（100％ - 41px）

：）