Personal Portfolio Webpage - Build a Personal Portfolio Webpage

HTML-CSS
1

/* 1. Your portfolio should have at least one media query*/ :smiling_face_with_tear:

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
  </head>
  <body>
    <nav id="navbar">
      <a id="projects" href="#projects"></a>
    </nav>
    <section id="welcome-section"><h1 >hello</h1>
  
    </section>
    
 
  <section id="projects">
    <header class="project-tile">1</header>
    <a id="profile-link" target="_blank" href="https://www.freecodcamp.com"></a>
  </section> 
  </body>
</html>

/* file: styles.css */
@media (max-width:600px){
body{
  font-size:16px;}
}
#welcome-section{
  height:100vh;
}
#navbar{
  display:flex;
  top:0
}

Your browser information:

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

Challenge Information:

Personal Portfolio Webpage - Build a Personal Portfolio Webpage

2

Hello @19851 !

I do not see the necessary link in the head of the html file to join it with the css file.

<!DOCTYPE html>
<html lang="en">
  <head>
  </head>
  <body>

I think this instruction was missed when you were doing the set up. :slight_smile: Note: Be sure to add <link rel="stylesheet" href="styles.css"> in your HTML to link your stylesheet and apply your CSS

3 
@media (max-width: 600px) {
  /* Your styles for mobile devices go here */
}

add last bracket
and yes,as it is sead you need a link for styles.css

2 Likes
4

Your css is fine, if you add the connecting link, I believe.

@media (max-width:600px){
body{
  font-size:16px;}
}

You have the correct set if with font, as long as the font is originally a different size.

1 Like
5

In addition to what has been said. You also need to give your #navbar a position of fixed. So that it sticks at the top.

2 Likes
6

thank you so much , for your answer :heart_eyes:

2 Likes
7

thank you so much , for your answer :heart_eyes:

1 Like
9

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