Technical Documentation Page - Build a Technical Documentation Page

please help
it keep saying “Failed:Your Technical Documentation project should use at least one media query.” althought i put the in the head .
help please !!

<!-- file: index.html -->
<!DOCTYPE HTML>
<html> 
<Head>
  <link rel="stylesheet" href="styles.css"/>
 <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>SJC Custom Drums Product Lines</title>
 </Head>
  <Body>
<main id="main-doc">
<section class="main-section" id="Introduction">
  <header>Introduction</header>
  <P>qqqqqqqqqqqqq qqqqqqqqqqqqqqqqqqqqqqqq</P>
  <code>llllllll lllllll</code>
  <li>hhhhhhhhh hhhhhhhh</li>
</section>
<section class="main-section" id="What_you_should_already_know">
  <header>What you should already know</header>
  <P>qqqqqqqqqqqqqqqq qqqqqqqqqqqqqqqqqqqqq</P>
  <code>lllllhhhhh hhhhhhhlll</code>
  <li>888888888 8888</li>
</section>
<section class="main-section" id="JavaScript_and_Java">
  <header>JavaScript and Java</header>
  <P>qqqqqqqqq q qqqqqqqqqq qqq qqqqq qqqqqqq qq</P>
  <code>khhh hhh hhhhh hhhhhhh hh hhhhhkkk</code>
  <li>44444hhhhh hhhh hhhhhhh hhhhhh44</li>
  <li>77777hhhhh hhhhh hhhhhhh7777777</li>
</section>
<section class="main-section" id="Hello_world">
  <header>Hello world</header>
  <P>qqqqq qqqqq qqqqqqqqqqq qqqqqqqqqqqqqqqq</P>
  <code>kkkhhh hhhhhhhhh hhhhhkkkk</code>
  <li>aaaj jjjj jj jjjj</li>
  <li>ssjjjj jjjjjjjj jjjjj jjss</li>
</section>
<section class="main-section" id="Variables">
  <header>Variables</header>
  <P>qqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqq</P>
  <code>141414</code>
  <li>hhhhhhhhhhhhhhhhhhhh</li>
</section>
<section class="main-section" id="Declaring_variables">
  <header>Declaring variables</header>
  <P>qqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqq</P>
  <code>jjhhhhhhhhhhhhhhhhhhhhhhhhhhhjj</code>
  <li>llllhhhhhhhhhhhhhhhhhhll</li>
</section>
<section class="main-section" id="Variable_scope">
  <header>Variable scope</header>
  <P>qqqqqqqqqqqqqqqq qqqqqqqqqqqqqqqqqqqqq</P>
  <P>qqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqq</P>
  <P>qqqqqqqqqqqqqqqqqqq  qqqqqqqqqqqqqqqqqq</P>
  <P>qqqqqqqqqqqqqqqqqqqq qqqqqqqqqqqqqqqqq</P> 
  <P>qqqqqqqqqqqqqqqq qqqqqqqqqqqqqqqqqqqqq</P>
  <P>qqqqqqqqqqqqqqqqqq qqqqqqqqqqqqqqqqqqq</P>
  <P>qqqqqqqqqqqqqqqqqq qqqqqqqqqqqqqqqqqqq</P>
  <code>oooooooooo</code>
  <code>oohhhhhh hhhhhhhhhhhhhhhhhoo</code>
  <li>uuuuuuuu uuuu</li>

  
</section>
<nav id="navbar">
  <header>
<a class="nav-link" href="#Introduction">Introduction</a>
<a class="nav-link" href="#What_you_should_already_know">What you should already know</a>
<a class="nav-link" href="#JavaScript_and_Java">JavaScript and Java</a>
<a class="nav-link" href="#Hello_world">Hello world</a>
<a class="nav-link" href="#Variables">Variables</a>
<a class="nav-link" href="#Declaring_variables">Declaring variables</a>
<a class="nav-link" href="#Variable_scope">Variable scope</a></header>
</nav>
</main>
</Body>
</html> 
/* file: styles.css */
body{
  background-color :white;
}
#navbar{
  padding:0;
}

Your browser information:

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

Challenge: Technical Documentation Page - Build a Technical Documentation Page

Link to the challenge:

Hi @GithubASamali,

Where is your media query?
Also ask yourself: Where does a media query go? What is it’s purpose?

Hope this helps.

Thanks,
Hal_Jordan

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