Personal Portfolio Webpage: Problem with navigation bar

1

Hi,

I’m currently working on my last project for the Responsive Web Design project and I have a bug I can’t fix.

The problem is that every time I click a link to navigate to the section, the top of the section is hidden behind the navigation bar.

I got so far to figure out that the problem is caused by position: fixed but I couldn’t find a way to fix it yet.

I would appreciate if you could have a look at it: https://codepen.io/stvfrnzl/pen/gNwBmM

Thanks a lot! :slightly_smiling_face:

2

since you position: fixed;your nav-bar it no longer counts in the page set-up.
So you could try to increase you margin-top for the <h1> elements, so that the margin compensates for the fixed navbar.

3

Update your CSS here:

#projects,
#contact {
    width: 100vw;
    **min-height: 100vh;**
  padding-top: 45**px**;
    text-align: center;

  }

min-height instead of height, and padding-top: 45px is what I used.

4

He guys,

I found a working solution:

I used anchor tags at the beginning of every section, which is nothing more but an empty div and a respective class. :slight_smile:

Thank you for your help!