将div放在导航栏下面

Question

我正尝试在标准的Sails.js视图中放置一个单张地图。Sails.js会自动向每个页面添加一个页眉。在高度固定的情况下，贴图如下所示：

#mapid {
    height: 400px;
}

​

​

这并不理想，因为我们希望高度可以根据屏幕大小灵活调整。使用absolute position时，地图会填满整个屏幕并隐藏顶部栏。

#mapid {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100%;
}

如何确保地图在保留顶栏的同时充满整个屏幕？我尝试将位置设置为相对位置，但这会隐藏地图。

Answer 1

将“top”值设置为top Set的高度。例如：

#mapid {
    position: absolute;
    top: 56px; // Here
    bottom: 0;
    width: 100%;
}