Personal Portfolio Webpage - Build a Personal Portfolio Webpage

Tell us what’s happening:

Step 11: “Your #navbar element should always be at the top of the viewport.”

Can’t seem to figure out what i’m doing wrong. I think I have it all in the #navbar but perhaps im placing it incorrectly. Where am I erring?

Your code so far

@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville&display=swap');

:root {
    --primary-color: #59392B;
    --secondary-color: #95B0AD;
} 

* {
    margin: 0;
    scroll-behavior: smooth;
}

body{
    font-family: 'Libre-Baskerville', sans-serif;
    text-align: center;
    background-color: var(--secondary-color);
}

h1{
font-size: 45;}

#navbar {
    display: flex;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: var(--primary-color);
    color: #fffffe;
    padding: 20px 0;
    font-size: 20px;
    z-index: 1;
 }

Your browser information:

User Agent is: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36

Challenge: Personal Portfolio Webpage - Build a Personal Portfolio Webpage

Link to the challenge:

I think you may have your padding the wrong way round, also, your nav bar does not have ANY height.

the yellow region is highlighted as padding

fixed but still no dice.

It would be helpful to be able to see your whole project, both files.

If its too big you can link to it, if you put it into code pen or on git hud.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.