Tell us what’s happening:
hi guys, the fixed position doesn’t work properly, the viewport is mixing with other items in the page.
Your code so far
https://codepen.io/Guysharon2202/pen/RmKPqq
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/74.0.3729.157 Safari/537.36.
Link to the challenge:
https://learn.freecodecamp.org/responsive-web-design/responsive-web-design-projects/build-a-product-landing-page
You should probably remove the relative positioning from your styles, particularly that of the divs. It’s not a good idea to directly apply styles to divs, as they are a generic element; target them with classes instead.
Also noticed that the header has some flex properties, but no display: flex set. You could then get rid of the relative positioning for the logo and navigation. There’s also no need to put flex-wrap in a media query. Just put it right in the header styles.
There’s also a lone <body> tag in your HTML. There’s no need for that in CodePen (and it might .