Tell us what’s happening:
Describe your issue in detail here.
**Your code so far**
/* file: index.html */
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>MOBILE PHONES</title>
</head>
<body>
<h1>MOBILE PHONES</h1>
<h3>Popular Brands</h3>
<nav id="navbar" class="nav"><ul class="nav-list">
<link rel="stylesheet" href="styles.css"> <header>Useful Links</header>
<ol>
<li><a class="nav-link" href="#Samsung">Samsung</a></li>
<li><a class="nav-link" href="#Apple">Apple</a></li>
<li><a class="nav-link" href="#One-plus">One-plus</a></li>
<li><a class="nav-link" href="#Redmi">Redmi</a></li>
<li><a class="nav-link" href="#Oppo">Oppo</a></li>
</ol>
</nav>
<main id="main-doc">
<section class="main-section" id="Samsung">
<header>
<h5><li>Samsung</li></h5></header>
<p>The Samsung is a South Korean multinational manufacturing conglomerate headquartered in Samsung Town, Seoul, South Korea.</p>
<p>Samsung was founded by Lee Byung-chul in 1938 as a trading company. </p>
<h6>Best Series</h6>
<code>Samsung Galaxy S22</code>
<code>Samsung Galaxy Z Fold 3</code>
</section>
<section class="main-section" id="Apple">
<header>apple</header>
<h5><li>Apple</li></h5></header>
<p>Apple was founded as Apple Computer Company on April 1, 1976, by Steve Jobs, Steve Wozniak and Ronald Wayne to develop and sell Wozniak's Apple I personal computer.</p>
<p>It was incorporated by Jobs and Wozniak as Apple Computer, Inc. in 1977</p>
<h6>Best Series</h6>
<code>Apple iPhone 13 Pro</code>
<code>Apple iPhone 11 Pro Max</code>
</section>
<section class="main-section" id="One-Plus">
<header>
<h5><li>One-Plus</li></h5></header>
<p>OnePlus was founded on 16 December 2013 by former Oppo vice-president Pete Lau and Carl Pei.</p>
<p>According to Chinese public records, OnePlus' only institutional shareholder is Oppo Electronics.</p>
<h6>Best Series</h6>
<code>OnePlus 10 Pro</code>
<code>OnePlus 8T.</code>
</section>
<section class="main-section" id="Redmi">
<header>
<h5><li>Redmi</li></h5></header>
<p>Redmi is a subsidiary company owned by the Chinese electronics company Xiaomi.</p>
<p>Models are divided into the entry-level Redmi, the mid-range Redmi Note, and the high-end Redmi K.</p>
<h6>Best Series</h6>
<code>Redmi 9A</code>
<code>Redmi 9 Activ</code>
</section>
<section class="main-section" id="Oppo">
<header>
<h5><li>Oppo</li></h5></header>
<p>The brand name "Oppo" was registered in China in 2001 and launched in 2004.</p>
<p>the company has expanded to 50 countries</p>
<h6>Best Series</h6>
<code>OPPO F21 Pro 5G</code>
<code>OPPO F19 Pro.</code>
</section>
</main>
</body>
</div>
</html>
/* file: styles.css */
div.main-body{
display: grid;
grid-template-column: minmax(300px,auto)1fr;
grid-gap: 20px;
grid-template-areas: "navbar mainContent";
}
@media screen only and (max-width:750px) {
div.main-body{
grid-template-columns:1fr;
grid-template-areas: "navbar";
}
}
**Your browser information:**
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/102.0.0.0 Safari/537.36
Challenge: Technical Documentation Page - Build a Technical Documentation Page
Link to the challenge: