Let’s add the simple HTML first. I have created links in div tag but we can have that in ul list or any other tag.
Aslo, there are additional paragraphs with ids so that it can be linked with the menu links.
Now, we are just gonna make the use of CSS position property.
The position property specifies the type of positioning method used for an element (static, relative, absolute, fixed, or sticky).
We can use the value fixed so that the menu container can be positioned relative to the browser window.
The ‘top: 20%‘, ‘left: 0‘ and ‘position:fixed‘ will set the position of the div container. So, 20% from the top of the window, and 0 from the left.
You can choose any values like ‘top: 50%‘, ‘left: 0‘ or ‘top: 50%‘, ‘right: 0‘ or ‘bottom: 0‘, ‘left: 0‘ etc. ‘bottom:0‘ will place the container wt the bottom of the window.
Here is the CSS code:
Checkout the end result on JSFiddle
fixed menu position sticky
