Anchors not working..?

HTML-CSS
1

Hi

Could someone please help me figure out why some of my anchors aren’t working in this project: https://codepen.io/this_girl_shall_code/pen/dygMYev

I have a ‘click here’ link in the bio section which doesn’t seem to work and I have also tried, in the reference section, to make the images link to websites but they aren’t working either. I just can’t see what the issue is and it’s driving me crazy! lol

Thanks in advance!

2

Hi emma002

Interesting! I have tried some stuff but still didnt worked :smiley: I will leave this comment here for notifications when a solution comes.

hope you will figure out.

3

Thanks for taking a look

4

Let me ask you this, why do you have z-index set to -1 on the #content div? Is this solving some specific problem? It might be causing a bigger problem.

5

Hi bbsmooth

I have the z-index set so that the navbar stays on top of the rest of the content otherwise it becomes hidden

6

You want to set a positive z-index on the nav, not a negative one on the content.

The use case for a negative z-index is not as common. They do have a time and place but you will more often be setting a positive z-index on the elements that need it.

Also, you should be aware that transform creates a new stacking context. The transform on #Home is doing just that.

Other properties to watch out for are opacity and filter (among others) they do the same thing and can cause stacking issues if you are not aware of it.

7

Thanks lasjorg! I have taken out the negative z-index on #content and instead added a positive one on nav ul and this has solved the issue. Also, that link was useful to understand it better too :pray:t2:

8

Another issue with my anchor in the bio - for some reason the colour is purple even though I have set the colour and visited colour to grey. The hover colour works though and changes to the correct red colour.

9

Your HTML:

<a id="tribute_link" ... >

Your CSS:

#tribute-link:hover { ... }
10

:woman_facepalming:t2: duh! :joy: thanks!! I had gone completely blind to the dash/underscore difference