Need help with this Technical Documentation Page

Hi guys, i need help with the Technical Documentation Page. It doesn’t display well on a smaller screen. I tried using display:flex; flex-direction:column to no avail. I also used position absolute for navbar, etc but it just displayed a fixed navbar.

Thank you so much

#main-doc has no width and the #navbar is currently dramatically narrow. You can give #navbar width using % instead of px (for example 20%), and also give appropriate width to #main-doc (at this case 80%, since 20+80=100).

Also I cannot see any media query here yet? That should work for smaller screens to put #main-doc under #navbar:

@media (max-width: 430px) {
  body, html {
    flex-direction: column;
  }
  #navbar, #main-doc {
    width: 100%;
  }
}
1 Like

thank you for the feedback. i am actually having some difficulty . i will try that code