Technical Documentation Page - Build a Technical Documentation Page

I cannot seem to figure out why I cannot get the final instruction to work: “Your Technical Documentation project should use at least one media query.”

I have specified the @media query inline - no success.
I have no style sheet option to add it too.

  **Your code so far**
/* file: index.html */
<head>
<link rel="stylesheet" href="styles.css">
</head>

<main id="main-doc">

<nav id="navbar">
<section class="main-section" id="header1">
  <header>header1</header>
  <p></p>
  <p></p>
  <code></code>
  <li>
  </li>
</section>
<a class="nav-link" href="#header1">header1</a>
<a class="nav-link" href="#header2">header2</a>
<a class="nav-link" href="#header3">header3</a>
<a class="nav-link" href="#header4">header4</a>
<a class="nav-link" href="#header5">header5</a>
</nav>

<section class="main-section" id="header2">
  <header>header2</header>
  <p></p>
  <p></p>
  <code></code>
  <li></li>
</section>

<section class="main-section" id="header3">
  <header>header3</header>
  <p></p>
  <p></p>
  <code></code>
  <li></li>
</section>

<section class="main-section" id="header4">
  <header>header4</header>
  <p></p>
  <p></p>
  <code></code>
  <li></li>
</section>

<section class="main-section" id="header5">
  <header>header5</header>
  <p></p>
  <p></p>
  <code></code>
  <li></li>
</section>
</main>
/* file: styles.css */

  **Your browser information:**

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

Challenge: Technical Documentation Page - Build a Technical Documentation Page

Link to the challenge:

Hi!
Can you please share your css? Without it, I can’t see your media query code.

To format your code, surround it by back ticks, or highlight the pasted code and press the button that looks like this </>. The gif below gives a visual demonstration of both of these.

Don’t worry. Found the problem when I switched to my desktop. For some reason the styles.css option did not show up on my laptop.

1 Like