Navbar broken when I began icons

1

Hello! I am trying to use the ul and li functions for two different areas. One of the areas is my navbar (located in css lines 16-50) and the other are my icon tags (located in css lines 173-217). I am trying to separate the two so I decided to use the “>” in the tag to specifically reference a certain section. After I separated the two, the navbar began to improperly respond.

I am thinking the problem is stemming from my “#navbar” tag in css, since it is not functioning at all now, but I am unsure why. Also, I’m assuming its related, but my navbar only works if I scroll out of the first section in my document.

My document: https://codepen.io/daniel-albano/pen/qBWrdoV?editors=1100

2

The last rule in your css is causing the problem, there’s an invisible layer over all your content. Once you resolve that and then point the links to the right place, it will work

.contact-links > ul li a:before
2 Likes