Relume Community Icon
Relume Community
  • 🏠Home
  • 📅Events

  • 🔵Announcements
  • 🔵General
  • 🔵Getting Started
  • 🔵Issues
  • 🔵Showcase

Powered by Tightknit
Issues
Issues

Troubleshooting Sticky Navbar Positioning Issues in CSS

Avatar of Quinn B.Quinn B.
·

Hi There! I would like to have this navbar be sticky to the top but when I set its position to this, I get this info warning (see screenshot). Any idea why?

5 comments

  • Avatar of Emily M.
    Emily M.
    ·

    When you use sticky positioning, the element needs to be stuck ‘relative’ to another element. That would be the first parent element with relative positioning. I guess your body element’s positioning isn’t set to relative, meaning the nav bar doesn’t know where to ‘stick’

  • Avatar of Matt J.
    Matt J.
    ·

    Quinn B. Would you mind sending a read-only link?

  • Avatar of Quinn B.
    Quinn B.
    ·

    Hi Matt J.! Here you go https://preview.webflow.com/preview/ben-lear-v2?utm_medium=preview_link&utm_source=des[…]63e7b1247132db4eab2daaeb1308a3e9&locale=en&workflow=preview

  • Avatar of Matt J.
    Matt J.
    ·

    Quinn B. you just need to define at what point from the top of the page do you want the element to be sticky. In this case I think you want 0. In some other cases, maybe you want it to be sticky after you've scrolled for 1rem or 2rem. It all depends. Unfortunately you can't change the position of a body tag - its always static.

  • Avatar of Quinn B.
    Quinn B.
    ·

    aha!!! You're the best! Thank you Matt J. as always!

    💪1