Css 导航杆杆顶部与车身100%

我正在构建一个react应用程序，并且有一个引导nabavr，它是StickyTop。我已将车身设置为

高度：100%

，当我这样做时，导航栏不再粘住。我不能在我的一个页面上使用vh，因为它会弄乱手机上的内容，所以我想坚持百分比。有办法做到这一点吗？我已经包括代码，使身体100%

html,
body,
#root {
  height: 100%;
  max-height: 100%;
}

---

您可以使用positionCSS属性（）

如有必要，还可以使用z-index属性（）

例如：

HTML

<div id="root">
  <nav>
    <div>item</div>
    <div>item</div>
    <!-- ... -->
    <div>item</div>
    <div>item</div>
  </nav>
  <main>
    <!-- ... -->
  </main>
</div>

---

如果你能提供一个工作代码示例来说明你提供的链接，这可能对OP很有用。请发布所有相关代码

#root {
    /* necessary */
    position: relative;
    height: 100vh;
}

nav {
    /* necessary */
    position: sticky; // you can also use 'fixed' value
    top: 0;
    left: 0;
    right: 0;

    /* not necessary */
    background-color: red;
    height: 2rem;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
}

main {
  /* necessary */
  overflow: hidden auto;
  /* margin-top: 2rem; if you have used fixed value */

  /* not necessary */
  height: 200%;
  background-color: green;
}