# Overlay fixed navigation bar

**URL:** <https://community.weweb.io/t/overlay-fixed-navigation-bar/10127>\
**Category:** How do I?\
**Created:** [August 7, 2024, 7:17am UTC](https://community.weweb.io/t/overlay-fixed-navigation-bar/10127 "2024-08-07T07:17:40Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![radume](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/radume/32/9698_2.png) [@radume](https://community.weweb.io/u/radume)\
**Post date:** [August 7, 2024, 7:17am UTC](https://community.weweb.io/t/overlay-fixed-navigation-bar/10127/1 "2024-08-07T07:17:40Z")

</div>

Hello everyone, I was wondering if it is possible to create an overlay floating navigation bar that has a fixed position when scrolling. Something like the image attached.  
 ![flutter_floating_bottom_bar](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/1/11c642ad0cec7a6db754ef81be3772c2c6708386.png)

---

<div class="post-metadata">

**Author:** ![Broberto](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/broberto/32/5918_2.png) [@Broberto](https://community.weweb.io/u/Broberto)\
**Post date:** [August 7, 2024, 7:31am UTC](https://community.weweb.io/t/overlay-fixed-navigation-bar/10127/2 "2024-08-07T07:31:28Z")

</div>

It is possible, and it actually is quite simple. Check this out, you need to set the div/section/whatever your navbar container is to: `position: fixed` and `bottom:0` (or whatever number you want it to be).

https://www.loom.com/embed/bf85cb8509e8402480c3b48075627dc1