# Wondering how to make a "sticky" navigation bar, even when. the page scrolls?

**URL:** <https://community.thunkable.com/t/wondering-how-to-make-a-sticky-navigation-bar-even-when-the-page-scrolls/2942005>\
**Category:** Questions about Thunkable X\
**Tags:** design, beginner\
**Created:** [April 11, 2024, 10:00pm UTC](https://community.thunkable.com/t/wondering-how-to-make-a-sticky-navigation-bar-even-when-the-page-scrolls/2942005 "2024-04-11T22:00:55Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![69521nf3gp7](https://avatars.discourse-cdn.com/v4/letter/6/8edcca/32.png) [@69521nf3gp7](https://community.thunkable.com/u/69521nf3gp7)\
**Post date:** [April 11, 2024, 10:00pm UTC](https://community.thunkable.com/t/wondering-how-to-make-a-sticky-navigation-bar-even-when-the-page-scrolls/2942005/1 "2024-04-11T22:00:55Z")

</div>

Hi, i’m making a Study Buddy app and am trying to add some content around a particular exam, example questions etc.

I need the page to be scrollable in order to add the amount of content that i need but i want the navigation bar to be “sticky” to the bottom of the page. My navigation bar is just a button as “background” and then images for the icons.

Any ideas on how to make this sticky to the bottom of the page?

For reference this is what my page elements look like:  
( i don’t have the elements that will be “scrolled” to in the page yet.)

 ![Screenshot 2024-04-12 at 9.59.18 AM](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/7/d/7da888f6e30f846ea5cc28148ca633225b761b80.png)  
 ![Screenshot 2024-04-12 at 9.59.28 AM](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/a/2/a2de4c0680fb4afd32a50b7215804c75852996d1.png)

---

<div class="post-metadata">

**Author:** ![tatiang](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tatiang/32/55482_2.png) [@tatiang](https://community.thunkable.com/u/tatiang)\
**Post date:** [April 12, 2024, 12:07am UTC](https://community.thunkable.com/t/wondering-how-to-make-a-sticky-navigation-bar-even-when-the-page-scrolls/2942005/2 "2024-04-12T00:07:22Z")

</div>

Use a Layout with two containers. The top container should be scrollable but the bottom container should not be. Put your main content in the top container and your navigation bar content in the bottom container. Give either or both containers a top/bottom margin so that they don’t run into each other.

---

<div class="post-metadata">

**Author:** ![69521nf3gp7](https://avatars.discourse-cdn.com/v4/letter/6/8edcca/32.png) [@69521nf3gp7](https://community.thunkable.com/u/69521nf3gp7)\
**Post date:** [April 14, 2024, 2:31am UTC](https://community.thunkable.com/t/wondering-how-to-make-a-sticky-navigation-bar-even-when-the-page-scrolls/2942005/3 "2024-04-14T02:31:46Z")

</div>

thank you so much!!

---

<div class="post-metadata">

**Author:** ![matt\_conroy](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/matt_conroy/32/150843_2.png) [@matt\_conroy](https://community.thunkable.com/u/matt_conroy)\
**Post date:** [April 15, 2024, 3:23pm UTC](https://community.thunkable.com/t/wondering-how-to-make-a-sticky-navigation-bar-even-when-the-page-scrolls/2942005/4 "2024-04-15T15:23:23Z")

</div>

@69521nf3gp7 It seems like Tatian was able to help solve your issue.

### ✅ Check please!

Sometimes people know the exact answer you are looking for and sometimes they might even go so far as to create an example just for you that completely solves your problem. It looks like that is the case here. Please click the little checkbox and mark their answer as “solved”

![community_solved](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/0/2/0274b8ea32bffae09b4e79821696cb9ef059b08b.gif)

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/0/f/0f59f292712368bce16ff80133ae10de8a6f27e8.png) [@system](https://community.thunkable.com/u/system)\
**Post date:** [July 14, 2024, 3:23pm UTC](https://community.thunkable.com/t/wondering-how-to-make-a-sticky-navigation-bar-even-when-the-page-scrolls/2942005/5 "2024-07-14T15:23:29Z")

</div>

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