Tell us what’s happening:
Describe your issue in detail here.
The first child of each .main-section should be a header element.
**Your code so far**
/* file: index.html */
/* file: index.html */
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"></meta>
<meta name="viewport" content="width=device-width, initial-scale=1.0"></meta>
<title>Technical Documentation Page</title>
<link rel="stylesheet" href="styles.css"></link>
</head>
<body>
<main id="main-doc">
<nav id="navbar">
<header>PROGRAMMING USING</header>
<a class="nav-link" href="#HTML_Properties">HTML Properties<a/>,
<a class="nav-link" href="#CSS_Properties">CSS Properties</a>,
<a class="nav-link" href="#JAVASCRIPT_Properties">JAVASCRIPT Properties</a>,
<a class="nav-link" href="#BOOTSTRAP_Properties">BOOTSTRAP Properties</a> AND
<a class="nav-link" href="#FIGMA_Properties">FIGMA Properties</a>
</header>
</nav>
<header>
<section class="main-section" id="HTML_Properties"><header>HTML Properties</header>
<article class="paragraph" ><p><i><a href="#HTML_Properties">HTML</a></i> stands for <strong>Hyper Text Markup Language</strong>, it is the standard markup language for creating Web pages and it describes the structure of a Web page.</p>
<code></code>
<p><i>HTML</i> consists of a series of elements which tells the browser how to display the content, these elements label pieces of content such as: <br>"this is a heading", "this is a paragraph", "this is a link", etc. e.g.</p>
<ul>
<li>HTML paragraph property</li>
</ul>
</article>
</section>
<section class="main-section" id="CSS_Properties"><header>CSS Properties</header>
<article class="paragraph" ><p><i><a href="#CSS_Properties">CSS<a/></i> is the language we use to style an HTML document. It describes how HTML elements should be displayed.</p>
<code></code>
<p><i>CSS</i> stands for <strong>Casscading Style Sheet</strong> CSS describes how HTML elements are to be displayed on screen, paper, or in other media
CSS saves a lot of work. It can control the layout of multiple web pages all at once
External stylesheets are stored in CSS files. e.g.</p>
<ul>
<li>CSS height/width property</li>
</ul>
</article>
</section>
<section class="main-section" id="JAVASCRIPT_Properties"><header>JAVASCRIPT Properties</header>
<article class="paragraph"><p><i><a href="#JAVASCRIPT_Properties" >JavaScript</a></i> is the world's most popular programming language.It is the programming language of the Web.</p>
<code></code>
<p>JavaScript is easy to learn. e.g</p>
<ul>
<li>getElementById() property</li>
</ul>
</article>
</section>
<section class="main-section" id="BOOTSTRAP_Properties"><header>BOOTSTRAP Properties</header>
<article class="paragraph"><p><i><a href="#BOOTSTRAP_Properties">Bootstrap 5</a></i> is the newest version of Bootstrap, which is the most popular HTML, CSS, and JavaScript framework for creating responsive, mobile-first websites.</p>
<code></code>
<p>Bootstrap is a free front-end framework for faster and easier web development
Bootstrap includes HTML and CSS based design templates for typography, forms, buttons, tables, navigation, modals, image carousels and many other, as well as optional JavaScript plugins. Bootstrap also gives you the ability to easily create responsive designs.</p>
<ul>
<li>BS5 Grid</li>
</ul>
</article>
</section>
<section class="main-section" id="FIGMA_Properties"><header>FIGMA Properties</header>
<article class="paragraph"><p><i><a href="#FIGMA_Properties">Figma</a></i> is a vector graphics editor and prototyping tool which is primarily web-based, with additional offline features enabled by desktop applications for macOS and Windows.</p>
<code></code>
<p>The Figma mobile app for Android and iOS allow viewing and interacting with Figma prototypes in real-time mobile devices</p>
<ul>
<li>Variant Property</li>
</ul>
</article>
</section>
</main>
</body>
</html>
/* file: styles.css */
/* file: styles.css */
@media (max-width: 1196) {
#navbar{
float: left;
}
}
.main-section:first-child {
color: black;
}
**Your browser information:**
User Agent is: Mozilla/5.0 (Windows NT 6.3; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/104.0.5112.81 Safari/537.36 Edg/104.0.1293.47
Challenge: Responsive Web Design Projects - Build a Technical Documentation Page
Link to the challenge: