Fixed top nav and fixed footer bar

User 2846958 Photo


Registered User
7 posts

Hi guys.

I'm wondering how to do a fixed top nav bar and an sticky footer bar on the same page?
I tried in position fixed and works on top nav, but for footer dont, so I sued sticky position and works but as long the breakpoints increase this footer dont stays at the bottom. Something I'm doing wrong.

Thanks.
User 2699991 Photo


Registered User
1,761 posts

Jose Rodriguez wrote:
Hi guys.

I'm wondering how to do a fixed top nav bar and an sticky footer bar on the same page?
I tried in position fixed and works on top nav, but for footer dont, so I sued sticky position and works but as long the breakpoints increase this footer dont stays at the bottom. Something I'm doing wrong.

Thanks.


1/ sticky doesn't work on all browsers (& mobile devices)
2/ you will need fix the height of the column/container holding the footer bar to 100 vmax at lower breakpoints & 100 vmin at higher breakpoints (where the height of the viewport is less than the width)
The Help You Need : When You Need It The Most
website https://rsdtutorials.com

User 2846958 Photo


Registered User
7 posts

Hi.

I just did it. Both are fixed in position. Top zero for top bar and the bottom zero for footer bar.
Thank you Wayan.

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.