Personal Portfolio Webpage - Build a Personal Portfolio Webpage

HTML-CSS
1

It said: " Your #navbar element should always be at the top of the viewport."
How can I do this?

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="styles.css"/>
    </head>
    <body>
      <section id="welcome-section">
       <h1>Welcome I am Deniz</h1>       
        </section>
        <section id="projects">
          <a class="project-tile"></a>
          </section>
          <header id="header">
          <nav id="navbar">
<ul>            <a href="#"></a>
</ul>            </nav>
</header>
            <a id="profile-link" target="_blank"></a>
      </body>

  </html>

/* file: styles.css */
@media (max-width: 200px) {
  #welcome-section{color:red;}
}

#navbar
  {
  position: fixed;
}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/110.0.0.0 Safari/537.36 Edg/110.0.1587.41

Challenge: Personal Portfolio Webpage - Build a Personal Portfolio Webpage

Link to the challenge:

2

Using position: fixed will indeed fix the position relative to the viewport, but you also need to specify where you want it to be fixed:

1 Like
3

So where do I need to specify in this situation?

4

Right below position: fixed, just like the example I linked you to.

1 Like
5

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