Sticky navbar and dropdown button issue

[Emilia05]

Hello! I just started to learn html, css, js. As I tried to make a sticky navigation bar with some script from internet, everything worked fine but not the dropdown button.
My codes: https://imgur.com/a/40iZuBy
Result: https://imgur.com/a/syjKKwh
If you can tell me what is wrong, I will appreciate.
The dropdown content if I set it on absolute, it works ok but when the navbar sticks to top of page it doesn’t show the content, if i set it on sticky, it’s working ok but the sidebar goes large as the dropdown content when I hover it, and if it’s fixed it doesn’t go after the button till the bar is fixed up.
Sorry for bad explanation,I did screenshots for you to understand what I’m saying. I appreciate your attention. Thank you.

[Beverleyh]

Can you pop it into a live CodePen demo for us please. It will easier for us to troubleshoot that way.

[Emilia05]

https://codepen.io/emilia-gratie/pen/bzxMrP

[Beverleyh]

The demo doesn’t seem to be exhibiting any undesirable behaviour for me here in Chrome. The dropdown menu position is directly below the ‘Options’ button regardless of whether the header is in view or not.

[Emilia05]

For me on chrome, and i tried even on another computer is like this: https://i.imgur.com/lylSbxM.png
This is with postion: sticky; at the dropdown-content: https://codepen.io/emilia-gratie/pen/mvGZKM

[Emilia05]

Any advice?

[Author]

Posts