Personal Portfolio Webpage - Build a Personal Portfolio Webpage

HTML-CSS
1

Your #navbar element should always be at the top of the viewport.

I’ve copied the answer posted by others but it’s not to working

<!-- file: index.html -->





<!DOCTYPE html>
<html lang="en">
  <head>
    <link rel="stylesheet" href="styles.css" />
    <link
      rel="stylesheet"
      href="https://use.fontawesome.com/releases/v5.8.2/css/all.css"
      integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay"
      crossorigin="anonymous"
    />
    <link
      href="https://fonts.googleapis.com/css?family=Poppins:200i,300,400&display=swap"
      rel="stylesheet"
    />
    <link
      href="https://fonts.googleapis.com/css?family=Raleway:700&display=swap"
      rel="stylesheet"
    />
  </head>
<!---navbar-->
  <body> 
    <header>
    <nav id="navbar" class="nav">
      <ul class="nav-list">
        <li>
          <a href="#welcome-section"><button>About</button></a>
        </li>
        <li>
          <a href="#projects"><button>Work</button></a>
        </li>
        <li>
          <a id="nav-con" href="#contact"><button>Contact</button></a>
        </li>
      </ul>
    </nav>
    </header>
<!--profile-section-->
    <span id="profile">
      <button>
        <a target="_blank" id="profile-link" src="https://www.freecodecamp.org/fccafafb630-e8e6-4ce9-a2ab-94f75a7ee456">Profile</a>
        </button>
    </span>
<!--welcome-->
   <span id="welcome-section">
     <h1 id="welcome">Welcome</h1>
     <p id=project-title>My Portfolio</p>     
   </span>
<!--project-section-->
    <span id="projects" class="projects">
    <h2>Projects<h2>  
      <p>FreeCodeCamp Projects</p>
      <navbar>
       <ul>
         <div id="projects"  >
           <li class="survey" ><a class="project-tile" src="https://www.freecodecamp.org/learn/2022/responsive-web-design/build-a-survey-form-project/build-a-survey-form">Survey</a></li>
         </div>
         <div class="tribute"> 
           <li id="projects ">
             <a class="project-tile" src="https://www.freecodecamp.org/learn/2022/responsive-web-design/build-a-tribute-page-project/build-a-tribute-page">Tribute Page</a>
           </li>
         </div>  
         <div class="tec-doc">
           <li id="projects">
             <a class="project-tile"src=" https://www.freecodecamp.org/learn/2022/responsive-web-design/build-a-technical-documentation-page-project/build-a-technical-documentation-page ">Technical Document</a>
           </li>
         </div>
        <div id="projects">
           <li class="project">
             <a class="project-tile" src="https://www.freecodecamp.org/learn/2022/responsive-web-design/build-a-product-landing-page-project/build-a-product-landing-page">Product landing page</a> 
           </li>
        </div>
        
       </ul>   
   </navbar>
   </span>
<!--contact-section-->
   <span id="contact">
     <div class="contact">
       <h3 class="contact">contact info<h3>
         <button class="email">Email
         </button>
       <button class="github" src="https://github.com/bumholeofdoom">Github </button>
       <button class="phone">Phone</button>
       <button class="linkedin" src="https://uk.linkedin.com/">LinkedIn</button>
     </div>
   </span>
</body>
</html>


    
    











    











/* file: styles.css */
*{
background:silver;
}

.welcome{
  background:gray;
  text-align:center;
  padding:10px;

}

#navbar {
  position: fixed ( top: 0)
  text-align:center;
}
.contact{
  background: gray;

}
@media {max-width: 780px;}{
  img {
  	width: 300px;
    	height: 300px;
      }
      }
}
#nav-con{
  text-align:right;
} 
#

Your browser information:

User Agent is: Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/133.0.0.0 Mobile Safari/537.36

Challenge Information:

Personal Portfolio Webpage - Build a Personal Portfolio Webpage

2

do you mean you copied this? this is not correct css

3

I’ve tried about 4/5 solutions found on google.that was just the last one i tried

4

do you know how to write that correctly?