No effect links

Please, I need an assistant. I don’t know what am doing wrong. cursor dont change when hover on link and the background color not covering the links.

https://codepen.io/Esther-Itolima/pen/NLaeZX

It’s not doing anything because the texts aren’t actually surrounded by a tags. It’s after a tags between li tags.

I don’t understand what you mean by background color not covering the links.

She means that she wanted the link to have a background of gray when the cursor hovers over the text.

As noted- the a tags aren’t set up right- that’s why the text background is not turning gray on hover and cursor not turning to pointer… move the part to after the text.
example <a href="">hello</a>

Oh d’oh! Thank you for the edit- I forgot that the code I entered actually BECAME code!

Thank you so much guys. You guys have really helped me to solve this issue

I also have another issue that i have been battling with for a very long time now. On my page there is a section where i will have “A little about me” and it was supposed to come after the navbar but i can’t see the text becos is hidden somewhere. You can on notice it when you use the developers tools
Please, I need assistant on that.
https://codepen.io/Esther-Itolima/pen/NLaeZX

Give that #welcome-section a position: relative,
since you have the img div as position absolute covering the entire body, elements inside it needs a relative position, you can see the difference by removing the relative position props from .portfolio

Have tried it and the text is visible but is the image not after the navbar

The navbar is fixed, therefore it stands top of all the elements. wherever you place your element, if it is given a fixed position it goes to top and stands there.

For absolute positioning, if you don’t mention it’s parent as relative position, then the <body> is considered as parent which holds the absolute content. ( This is what happened with your image div )

ok so what do you advise I should do for the text to be placed after the navbar?

You want the text below the navbar …?

Yes I want the text to be different below the navbar.

Then I would recommend you cut the section containing the text and place it inside <header> below the <nav> and give you header a flex-direction as column

Ok, but I think it will be placed inside the header and i dont want that. I want it to be a different section on it own after the navbar

Fine, then you can have that text section like you had before,

Just make the text section as fixed and take it to bottom

Now, give your header a bottom value of 4rem or 5rem

You will get the desired result

This is the design am working on
https://www.behance.net/gallery/31762581/MariaAnna-Free-One-Page-Portfolio-Template

I tried this but not working.

I saw the design, from that, i would say you are slightly in a more painful direction. I’ll suggest some things.

Before that, add this to your #about-section , to see the difference,

position: fixed;
width: 100%;
bottom: 0;
left: 0;

And give your header a bottom: 4rem

Remove the fixed props and absolute props you have given to any elements ( Only remove those props )

And remove the <img> tag, instead of that, assign a background-image props to the parent div ( .hero-image ) and give that image url to the background-image.

You will almost get the result you needed.

Yesssss!!! Is working…(dancing)
Thank you so much!