Responsive Web Design Projects - Build a Personal Portfolio Webpage

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.

why my media query is not workingg
Your code so far

/* file: index.html */
<head>
<style>
  <link rel="stylesheet" href="styles.css">
  <meta content= "width=device-width, initial-scale=1" name= "viewport" />

   @media all and (width:700px){ 
body {
color:red;
}
}

</style>
</head>
<body>
<header position: fixed;
width: 100>
<nav id="navbar" style="position: fixed; top: 0">
<ul>
  <li><a id="profile-link" href="#welcome-section" target="_blank" aniamtion="rotating"></a> </li>
</ul>
</nav>
</header>
<section id="welcome-section">
  <h1>welcome </h1>
 </section>
 <section id="projects">
   <a href="https://www.freecodecamp.org"></a>
   <p class="project-tile"> hehe</p>
 </section>
 

</body>

/* file: styles.css */
@media all and (width:20px){ 
.project-tile {
color:red;
}
}

  **Your browser information:**

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:102.0) Gecko/20100101 Firefox/102.0

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

Link to the challenge:

2

Why some of your HTML tags are inside the style tag?

1 Like
3

i was trying the media query inside the style element but even if i delete that the media query is not working any idea ?

4

Did you move meta and link tag outside of the style tag?

1 Like
5

nope bro it’s like this

6

Well, style tag is for CSS stuff, for selectors.
Place your link and meta tag inside the head element, as it should be, and try it.

For style you have CSS file.

From your question, I did not understand tho: you can’t pass the tests or you passed them and don’t like how your page looks?

7

yesss thanks bro it worked my bad

8

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