The text of my "main-doc" moves over the nav when the viewport is small?

I am really new to coding and now stuck for two hours without an appropriate solution but since it’s way past my bedtime I decided to ask. The title explains it all and you can see if for yourself in here: https://codepen.io/toooortoise/pen/JjRdYvZ?editors=1010 . So in my phone or when I make the tab small and the slider appears instead of moving to the intended part of the page the text itself moves to the nav part.
Also any advice and critic it is not only welcomed but appreciated.
Btw ignore the text on my site… I was just trying to fulfill the user stories for the test. Thank you

Probably because you used position: absolute for #main-doc

Hello,

you need media queries to adjust layout on smaller screens.

ps: <meta> tags must be inside <head>
pps: love the idea and colors!

1 Like