Technical Documentation Page - Build a Technical Documentation Page

HTML-CSS
1

Good day, I tick all the boxes except from the last box which says:“Your Technical Documentation project should use at least one media query.”

here is my code. I copied the stylesheet link from this forum as it solved the problem for someone with the same problem. Unfortunately it doesn’t work for me.

Thank you for help.

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en"
<head>
  <link rel="stylesheet" href="styles.css">
</head>
  <body>
    <main id="main-doc">
         <section class="main-section" id="Introduction">
              <header>Introduction</header>
              <li></li>
              <code></code>
                   <p></p>
                   <p></p>
                   </section>
         <section class="main-section" id="What_you_should_already_know">
              <header>What you should already know</header> 
              <li></li>
              <code></code>
                   <p></p>
                   <p></p>
                    </section>
          <section class="main-section" id="JavaScript_and_Java">
              <header>JavaScript and Java</header>
              <li></li>
              <code></code>
                   <p></p>
                   <p></p>
                    </section>
          <section class="main-section" id="Hello_world">
              <header>Hello world</header>
              <li></li>
              <code></code>
                   <p></p>
                   <p></p>
                    </section>
          <section class="main-section" id="Variables">
              <header>Variables</header>
              <li></li>
              <code></code>
                   <p></p>
                   <p></p>
                    </section>
<div>
<nav id="navbar">
     <header>
       
     <li> <a class="nav-link" href="#Introduction">Introduction</li></a>
     <li> <a class="nav-link" href="#What_you_should_already_know">What you should already know </li></a>
     <li> <a class="nav-link" href="#JavaScript_and_Java">JavaScript and Java</li></a>
     <li> <a class="nav-link" href="#Hello_world">Hello World</li></a>
     <li> <a class="nav-link" href="#Variables">Variables</li></a>
     </header>
</nav>
</div>


                        
    </main>
    </body>
<


</html>

/* file: styles.css */

Your browser information:

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

Challenge: Technical Documentation Page - Build a Technical Documentation Page

Link to the challenge:

2

Try solve this one first. Close the element and let’s see if there is another problem that occured

3

closed it but did not work.

Introduction
4

Which step you don’t pass? If it is media query you can post your css here too

7

Sorry still trying to figure this whole forum thing here out. Its my first question I am asking here.

html, body {
    min-width: 290px;
    color: #4d4e53;
    background-color: #ffffff;
    font-family: 'Open Sans', Arial, sans-serif;
    line-height: 1.5;
}
8

Its not ideal that I copy pasted this element in but it solved my problem. The Task is done but still don’t know what mistake I made.

<video  controls />
  <source src="https://youtu.be/sn3CHauUbQ0" type="video/mp4">
  Your browser does not support the video tag.
</video>
9

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