我正在设计一个基于GitLab的Jekyll Creative主题的网站，我想使用OpenLayers 7.3.0嵌入一个Map。
该主题有一个导航栏，50像素的高度，停留在顶部的所有时间。我希望Map使用导航栏下面的所有空间，即100%减去50像素。
我通过将下面的样式应用到保存map的空div来实现：

#map {
  /* configure the size of the map */
  width: 100%;
  height: 100%;
  /* padding for the nav bar */
  padding-top: 50px;
}

使用padding-top，Map的大小是正确的。但是，导航到#map将导航到填充的顶端，导致Map上方显示50px的条纹，而底部的Map被切断。（此外，这将在Map上方给予50px的空白，这可能也不可取。）
我如何调整div的大小，使其内容高度比内容区域的高度低50px，并获得某种锚，将我带到Map的顶部边缘？