Help with basic side navbar


For the past week, I’ve been really interested in creating cool sidebars for my mini-projects.
The tutorials I’ve found included Javascript with other content and I just couldn’t follow along, so I decided to just do it from what I know so far.

The only problem is I can’t change the focus color for

  • and the sidebar looks so awkward/ugly when on mobile size. The hamburger collapse menu spills over the page when opened :frowning:
    (I honestly think I messed up the divs or didn’t add enough)

    I would really appreciate it if anyone can help me out with this or just make some recommendations please…

  • #2

    One thing that is going to slow you down here is how you have everything set up in codepen. Fonts and CSS files should get added to the CSS section of your codepen settings. JS Files should go in the JavaScript section, and all of your <head> should go in the general settings "stuff for <head>" section. Once you do that, you’ll notice some changes in your CSS suddenly will work - like turning the navbar black.

    Maybe try setting up your codepen correctly first and see if you can make more progress? You may also want to ask in the Front End Chat Room: since it may require some back and forth to get it looking the way you want.


    Well I was doing the code on brackets but I had to put it in codepen so people can see it.
    I linked the js/css files right on my brackets html file- still shows me the same results though :frowning:

    Thanks for the suggestion anyway!