Responsive Web Design Projects - Build a Personal Portfolio Webpage

HTML-CSS
1

Tell us what’s happening:
I don’t what to do last check @media rules don’t work , I write position: fixed to navbar, but it does not check

Your code so far

<!-- file: index.html -->
<link rel="stylesheet" href="styles.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<section id="projects">
  <div class='project-tile'>My project's here</div>
  <a href='#'></a>
  <nav id='navbar'>
    <a target='_blank' id='profile-link' href='#'>Hello</a>
  </nav>


<section id="welcome-section">
  <h1>Welcome</h1>
</section>


</section>

/* file: styles.css */
@media (min-height: 680px){ 
#projects {
color:red;
position:relative;
}
#navbar { 
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  background-color: #cc0000;
  color: white;
  font-family: 'Exo 2', sans-serif;
  padding: 1em;
}
}

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.5 Safari/605.1.15

Challenge: Responsive Web Design Projects - Build a Personal Portfolio Webpage

Link to the challenge:

2

try putting these inside a head element block

3

I’d be careful with the bracket structure on this css code. A second bracket should go after the media query, not after the #navbar. Otherwise you’ll get into a tangle with any more css you add.

4

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