在粘性元素下方固定元素

Question

我正在使用Bootstrap4。我有一个标头，在其下方的是导航栏。在下面，我有行，其中有 2列。在左列中，我希望用户滚动时标头在导航栏下方保持固定。右列也一样，我希望它保持在导航栏下方固定。我还希望它在导航栏未折叠的小型视口上工作。

这是正在运行的示例： https://www.codeply.com/go/Z2DvfjYF0j

Answer 1

HTML：

<h3 class="bg-primary" id="MyStickeHeader">Header</h3>

CSS：

#MyStickeHeader{
  position: -webkit-sticky;
  position: sticky;
  top: 3.5rem;
}

这是demo链接