Navbar Help on Portfolio Page

Code Feedback
1

So I wanted to try something different, I found an image that I wanted to use as my nav bar, but I ran into a problem with it. The first thing is that it’s not letting me change the font color on the nav bar. Second thing is that my boxes below won’t start stacking, just overlapping, resulting in me having to ‘margin-top’ for a temporary fix and a temporary view of how I’m going to be setting up my portfolio page. However, I don’t really want to continue because of this.

I tried a few things, such as putting a transparent box over it and putting the z-index to put the transparent box over the nav bar image and adding the text links that way, but that didn’t really fix anything. Any suggestions or am I not able to set my nav bar as an image?

Sorry if this is confusing, just want to continue with my project

Here’s the codepen.io for reference

https://codepen.io/jchristian5/pen/KKMjGQq

2

Hi!

It seems that you aren’t able to set the color of your link because your selector is not specific enough. Try the following:

li a {
  color: #505050
}

If you intend to remove the blue underline for your link, use the following code:

text-decoration: none;

As for the overlapping issue, in my case, I also added a margin-top to troubleshoot the problem.

Here is my completed portfolio project in case you need a reference.

Hope it helps!

3

Thanks, it helped! However, the only problem I’m having is when I click on the links at the top, it just sends me to the top of the page. Was there a work around you had to do to fix that part?