# Floating button over navigation

**URL:** <https://community.glideapps.com/t/floating-button-over-navigation/51911>\
**Category:** Ask for Help\
**Created:** [October 17, 2022, 7:48am UTC](https://community.glideapps.com/t/floating-button-over-navigation/51911 "2022-10-17T07:48:10Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Dale\_Nelson](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/dale_nelson/32/18650_2.png) [@Dale\_Nelson](https://community.glideapps.com/u/Dale_Nelson)\
**Post date:** [October 17, 2022, 7:48am UTC](https://community.glideapps.com/t/floating-button-over-navigation/51911/1 "2022-10-17T07:48:11Z")

</div>

Has anyone attempted something similar to this image?

I’ve tried repositioning the floating button and it just ends up behind the navigation bar  
 ![Screenshot_20221017_154531_Chrome](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/a/9/a9f4a72570c4038964cfdc17908dd8fdd0de72e4.jpeg)

---

<div class="post-metadata">

**Author:** ![Lucas\_Pires](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lucas_pires/32/64863_2.png) [@Lucas\_Pires](https://community.glideapps.com/u/Lucas_Pires)\
**Post date:** [October 17, 2022, 2:48pm UTC](https://community.glideapps.com/t/floating-button-over-navigation/51911/2 "2022-10-17T14:48:47Z")

</div>

Hey Dale!

I haven’t been able to do this with CSS, but I know people who have… But it’s too tricky!

---

<div class="post-metadata">

**Author:** ![Uzo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/uzo/32/22639_2.png) [@Uzo](https://community.glideapps.com/u/Uzo)\
**Post date:** [October 17, 2022, 3:22pm UTC](https://community.glideapps.com/t/floating-button-over-navigation/51911/3 "2022-10-17T15:22:40Z")

</div>

very tricky… unless you replace the native Glide bottom bar with custom, then not that hard 😉 but still lots of work to match your design.

---

<div class="post-metadata">

**Author:** ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)\
**Post date:** [October 18, 2022, 12:12am UTC](https://community.glideapps.com/t/floating-button-over-navigation/51911/4 "2022-10-18T00:12:50Z")

</div>

Basically you have to move a floating button to the middle, and be able to do it on every device possible is a bit cumbersome.

---

<div class="post-metadata">

**Author:** ![Dale\_Nelson](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/dale_nelson/32/18650_2.png) [@Dale\_Nelson](https://community.glideapps.com/u/Dale_Nelson)\
**Post date:** [October 18, 2022, 12:40am UTC](https://community.glideapps.com/t/floating-button-over-navigation/51911/5 "2022-10-18T00:40:51Z")

</div>

Thats fair. Thanks for the feedback team

---

<div class="post-metadata">

**Author:** ![Uzo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/uzo/32/22639_2.png) [@Uzo](https://community.glideapps.com/u/Uzo)\
**Post date:** [October 18, 2022, 1:03am UTC](https://community.glideapps.com/t/floating-button-over-navigation/51911/6 "2022-10-18T01:03:18Z")

</div>

Make z-index:2!important of nav bar … make height of the center panel 80%, and move button to center using fixed position… add png overlay to create nice space around… that’s all… 😉

---

<div class="post-metadata">

**Author:** ![Lucas\_Pires](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lucas_pires/32/64863_2.png) [@Lucas\_Pires](https://community.glideapps.com/u/Lucas_Pires)\
**Post date:** [October 18, 2022, 1:21am UTC](https://community.glideapps.com/t/floating-button-over-navigation/51911/7 "2022-10-18T01:21:26Z")

</div>

Yes, still tricky lol

Btw, I know @Pedroydzito managed to do it

---

<div class="post-metadata">

**Author:** ![system](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/system/32/53398_2.png) [@system](https://community.glideapps.com/u/system)\
**Post date:** [October 19, 2022, 1:21am UTC](https://community.glideapps.com/t/floating-button-over-navigation/51911/8 "2022-10-19T01:21:45Z")

</div>

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.