It is my codepen https://codepen.io/fukenist/pen/yRJYMP?editors=0100 and I can’t get why contents overlap main body page.
position:fixed takes that navigation section out of the main flow. Without any other styling it situates in upper left corner.
With your navigation out of the flow the rest of your content fills all available space.
It looks like you’ve tinkered with using grid some on that pen too. There are so many ways to control layout it is hard to tell you how to proceed - there’s no one right way. You’ll probably have to research this some and come up with a scheme that you’re comfortable with.
Adding to what @alhazen1 said, you could set the width of your nav menu to a fix size (let’s say 200px) and then add a margin-left property to the #main-section selector and use a value larger than 200px to shift the content over to the right.
Thanks, I’ve made width of #navbar 30% and #main-section margin left 50% and it worked. Are we get some sertificate after completing course? I’ve just completed CSS