Tell us what’s happening:
Describe your issue in detail here.
**Your code so far**
/* file: index.html */
see<!DOCTYPE HTML >
<html>
<head><Link rel="stylesheet" href="style.css" />
<meta charset="UTF-8" /><meta name="viewport" content="width=device -width, initial-scale=1.0" /></head>
<body>
<main id="main-doc">
<section class ="main-section " id="Birth_of_Ojadile"><header>Birth of Ojadile</header >
<p>Ojadile was the sole male and last child of his parents: </p>
<ul ><li>one </li >
<li>two </li>
</ul >
<p>He was born in <code>Amandine</code > Lokoja </p>
</section>
<section class ="main-section " id="Travails_of_a_youth"><header>Travails of a youth</header>
<p>When he was but a teen, his father passed away:</p>
<ul>
<li>three </li>
<li >four </li >
</ul >
<p>He had to balance between managing his father's business and taking care if the why<code>family</code> </p>
</section>
<section class ="main-section " id="A_new_dawn"><header>A new dawn </header >
<p>Due to his faithfulness and diligence to his work the business <code>prospered</code> </p>
<p>He started opening branches in several locations and places </p>
</section>
<section class ="main-section " id="Battle_of_kings"><header>Battle of kings</header >
<p>He encountered numerous envious people who don't like how successful he has become:</p>
<ul><li>five </li></ul >
<p>Ojadile overcame all adversities because of his <code>unyielding</code> spirit </p>
</section>
<section class ="main-section "id="Fall_of_an_emperor"><header>Fall of an emperor </header>
<p>Ojadile lived a good life and was helpful to the <code>society</code></p>
<p>The sun rises and set so is a the death of a <code>noblenoble</code > natural </p>
</section>
</main>
<nav id="navbar">
<header>Nav links </header >
<a href="#Birth_of_Ojadile" class ="nav-link">Birth of Ojadile</a >
<a href="#Travails_of_a_youth" class="nav-link">Travails of a youth </a>
<a href="#A_new_dawn" class="nav-link">A new dawn</a >
<a href="#Battle_of_kings" class="nav-link">Battle of kings</a >
<a href="#Fall_of_an_emperor" class="nav-link ">Fall of an emperor</a >
</nav>
</body>
</html>
/* file: styles.css */
*{box-sizing:border-box;}
#main-doc
{background :#38b;
padding :5px;
margin :0 4px;}
@media(min-width:1000px) {#main-doc{background :#32a;
padding :2px;
margin :2px;}}
.main-section{font-size:3px;
}
@media(max-width:600px){.main-section{font-size:10px;}}
**Your browser information:**
User Agent is: Mozilla/5.0 (Linux; Android 9; A3_Pro) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.0.0 Mobile Safari/537.36
Challenge: Technical Documentation Page - Build a Technical Documentation Page
Link to the challenge:
