html - 将固定导航栏与旋转木马精确对齐

Question

我在标题中添加了“固定顶部”，但现在轮播的一部分位于导航栏后面。

(图中部分建筑在导航栏后面)

有没有办法将它们放置在彼此之下，不重叠且不添加手动边距 px？

代码:

<nav class="navbar navbar-expand-lg navbar-light bg-light fixed-top">
  //CONTENT
</nav>

<div id="demo" class="carousel slide" data-ride="carousel">
  //CONTENT
</div>

Answer 1

尝试通过这种方式实现您的目标。

.fixed-top{
  height:48px; //if you are taking height 48px;
  position:fixed;
  width:100%;
}
.carousel{
  position:relative;
  top:48px; // use top 48px to solve this problem
}