Tell us what’s happening:
Il progetto di documentazione tecnica dovrebbe avere almeno un media query.
The technical documentation project should have at least one media query.
Your code so far
<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Technical Documentation Page</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<nav id="navbar">
<header>Documentation</header>
<a class="nav-link" href="#section_one">Section One</a>
<a class="nav-link" href="#section_two">Section Two</a>
<a class="nav-link" href="#section_three">Section Three</a>
<a class="nav-link" href="#section_four">Section Four</a>
<a class="nav-link" href="#section_five">Section Five</a>
</nav>
<main id="main-doc">
<section class="main-section" id="section_one">
<header>Section One</header>
<p>Introduction to Section One.</p>
<p>Further details about Section One.</p>
<code>Code example for Section One</code>
<ul>
<li>Item one</li>
<li>Item two</li>
<li>Item three</li>
</ul>
</section>
<section class="main-section" id="section_two">
<header>Section Two</header>
<p>Introduction to Section Two.</p>
<p>Further details about Section Two.</p>
<code>Code example for Section Two</code>
<ul>
<li>Item one</li>
<li>Item two</li>
<li>Item three</li>
</ul>
</section>
<section class="main-section" id="section_three">
<header>Section Three</header>
<p>Introduction to Section Three.</p>
<p>Further details about Section Three.</p>
<code>Code example for Section Three</code>
<ul>
<li>Item one</li>
<li>Item two</li>
<li>Item three</li>
</ul>
</section>
<section class="main-section" id="section_four">
<header>Section Four</header>
<p>Introduction to Section Four.</p>
<p>Further details about Section Four.</p>
<code>Code example for Section Four</code>
<ul>
<li>Item one</li>
<li>Item two</li>
<li>Item three</li>
</ul>
</section>
<section class="main-section" id="section_five">
<header>Section Five</header>
<p>Introduction to Section Five.</p>
<p>Further details about Section Five.</p>
<code>Code example for Section Five</code>
<ul>
<li>Item one</li>
<li>Item two</li>
<li>Item three</li>
</ul>
</section>
</main>
</body>
</html>
/* file: styles.css */
#navbar {
position: fixed;
top: 0;
left: 0;
width: 200px;
height: 100%;
background-color: #f4f4f4;
padding: 20px;
}
main {
margin-left: 220px;
padding: 20px;
}
#navbar a {
float: left;
display: block;
color: white;
text-align: center
padding: 14px 16px;
text-decoration: none;
}
Your browser information:
Lo user agent è: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/127.0.0.0 Safari/537.36
Challenge Information:
Pagina di documentazione tecnica - Crea una pagina di documentazione tecnica