Tell us what’s happening:
Failed:Each .main-section should have an id that matches the text of its first child, having any spaces in the child’s text replaced with underscores (_) for the id’s
I can’t seem pass this check, does anyone have any idea? My code is all correct.
Please help if you can. 
Your code so far
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Technical Documentation by Thuyacs</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<nav id="navbar">
<header>Technical Documentation</header>
<a href="#Introduction" class="nav-link">Introduction</a>
<a href="#What_You_Should_Already_Know" class="nav-link">What You Should Already Know</a>
<a href="#Python_and_Other_Languages" class="nav-link">Python and Other Languages</a>
<a href="#A_Simple_'Hello,_World!'_Program" class="nav-link">A Simple 'Hello, World!' Program</a>
<a href="#Variables" class="nav-link">Variables</a>
<a href="#Declaring_Variables" class="nav-link">Declaring Variables</a>
<a href="#Variable_Scope" class="nav-link">Variable Scope</a>
<a href="#Global_Variables" class="nav-link">Global Variables</a>
<a href="#Constants" class="nav-link">Constants</a>
<a href="#Data_Types" class="nav-link">Data Types</a>
<a href="#if_else_Statement" class="nav-link">if...else Statement</a>
<a href="#while_Statement" class="nav-link">while Statement</a>
<a href="#Function_Definitions" class="nav-link">Function Definitions</a>
<a href="#Reference" class="nav-link">Reference</a>
</nav>
<main id="main-doc">
<section class="main-section" id="Introduction">
<header>Introduction</header>
<article>
<p>
Python is a high-level, interpreted programming language known for its readability and simplicity.
</p>
<p>
Python supports multiple programming paradigms including procedural, object-oriented, and functional programming.
</p>
<p>
It is widely used for web development, data analysis, artificial intelligence, and more.
</p>
<pre><code>print("Hello, World!")</code></pre>
</article>
</section>
<section class="main-section" id="What_You_Should_Already_Know">
<header>What You Should Already Know</header>
<article>
<ul>
<li>Basic understanding of programming concepts.</li>
<li>Knowledge of another programming language is helpful.</li>
<li>Familiarity with basic computer operations.</li>
</ul>
</article>
</section>
<section class="main-section" id="Python_and_Other_Languages">
<header>Python and Other Languages</header>
<article>
<p>
Python is known for its simplicity compared to other programming languages like C++ or Java.
</p>
<p>
Unlike C++, Python is dynamically typed and does not require explicit type declarations.
</p>
</article>
</section>
<section class="main-section" id="A_Simple_'Hello,_World!'_Program">
<header>A Simple 'Hello, World!' Program</header>
<article>
<p>To print "Hello, World!" in Python, you can use the following code:</p>
<pre><code>print("Hello, World!")</code></pre>
</article>
</section>
<section class="main-section" id="Variables">
<header>Variables</header>
<article>
<p>Variables in Python are used to store data values.</p>
<pre><code>x = 10
y = "Hello"
print(x, y)</code></pre>
<ul>
<li>Variables are created when you assign a value to them.</li>
<li>Variables can hold different types of data, including integers and strings.</li>
</ul>
</article>
</section>
<section class="main-section" id="Declaring_Variables">
<header>Declaring Variables</header>
<article>
<p>In Python, variables are declared by assigning a value to them:</p>
<pre><code>age = 25
name = "Alice"</code></pre>
</article>
</section>
<section class="main-section" id="Variable_Scope">
<header>Variable Scope</header>
<article>
<p>Variables have a scope which determines where they can be accessed in the code.</p>
<pre><code>def my_function():
local_var = "I'm local"
print(local_var)
my_function()
print(local_var) # This will cause an error</code></pre>
</article>
</section>
<section class="main-section" id="Global_Variables">
<header>Global Variables</header>
<article>
<p>Global variables are declared outside of functions and can be accessed from anywhere in the code:</p>
<pre><code>global_var = "I'm global"
def my_function():
print(global_var)
my_function()
print(global_var)</code></pre>
</article>
</section>
<section class="main-section" id="Constants">
<header>Constants</header>
<article>
<p>Constants are values that do not change during the execution of the program:</p>
<pre><code>PI = 3.14159</code></pre>
</article>
</section>
<section class="main-section" id="Data_Types">
<header>Data Types</header>
<article>
<p>Python supports various data types including:</p>
<ul>
<li>Integers</li>
<li>Floats</li>
<li>Strings</li>
<li>Lists</li>
<li>Tuples</li>
<li>Dictionaries</li>
</ul>
</article>
</section>
<section class="main-section" id="if_else_Statement">
<header>if...else Statement</header>
<article>
<p>The `if` statement is used to execute code based on a condition:</p>
<pre><code>if age > 18:
print("Adult")
else:
print("Minor")</code></pre>
</article>
</section>
<section class="main-section" id="while_Statement">
<header>while Statement</header>
<article>
<p>The `while` loop executes as long as a condition is true:</p>
<pre><code>n = 0
while n < 5:
print(n)
n += 1</code></pre>
</article>
</section>
<section class="main-section" id="Function_Definitions">
<header>Function Definitions</header>
<article>
<p>Functions are defined using the `def` keyword:</p>
<pre><code>def greet(name):
return f"Hello, {name}!"</code></pre>
</article>
</section>
<section class="main-section" id="Reference">
<header>Reference</header>
<article>
<ul>
<li>All content is based on Python documentation from <a href="https://www.python.org/doc/" target="_blank">Python.org</a></li>
</ul>
</article>
</section>
</main>
</body>
</html>
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Space+Grotesk:wght@300..700&display=swap');
* {
font-family: 'Poppins';
}
header {
font-size: 30px;
}
article {
border-radius: 10px;
padding: 20px;
}
#navbar {
position: fixed;
min-width: 290px;
justify-content: space-between;
box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
top: 0px;
left: 0px;
width: 300px;
height: 100%;
border-right: solid;
border-color: #2c2c2c;
}
html,
body {
min-width: 290px;
color: #4d4e53;
background-color: #ffffff;
font-family: 'Open Sans', Arial, sans-serif;
line-height: 1.5;
}
#navbar {
position: fixed;
min-width: 290px;
top: 0px;
left: 0px;
width: 300px;
height: 100%;
border-right: solid;
border-color: rgba(0, 22, 22, 0.4);
overflow: hidden;
}
header {
color: black;
margin: 10px;
text-align: center;
font-size: 1.8em;
font-weight: thin;
}
#main-doc header {
text-align: left;
margin: 0px;
}
#navbar ul {
height: 88%;
padding: 0;
overflow-y: auto;
overflow-x: hidden;
}
#navbar li {
color: #4d4e53;
border-top: 1px solid;
list-style: none;
position: relative;
width: 100%;
}
#navbar a {
display: block;
padding: 10px 30px;
color: #4d4e53;
text-decoration: none;
cursor: pointer;
}
#main-doc {
position: absolute;
margin-left: 310px;
padding: 20px;
margin-bottom: 110px;
}
section article {
color: #4d4e53;
margin: 15px;
font-size: 0.96em;
}
section li {
margin: 15px 0px 0px 20px;
}
code {
display: block;
text-align: left;
white-space: pre-line;
position: relative;
word-break: normal;
word-wrap: normal;
line-height: 2;
background-color: #f7f7f7;
padding: 15px;
margin: 10px;
border-radius: 5px;
}
@media only screen and (max-width: 815px) {
/* For mobile phones: */
#navbar ul {
border: 1px solid;
height: 207px;
}
#navbar {
background-color: white;
position: absolute;
top: 0;
padding: 0;
margin: 0;
width: 100%;
max-height: 275px;
border: none;
z-index: 1;
border-bottom: 2px solid;
}
#main-doc {
position: relative;
margin-left: 0px;
margin-top: 270px;
}
}
@media only screen and (max-width: 400px) {
#main-doc {
margin-left: -10px;
}
code {
margin-left: -20px;
width: 100%;
padding: 15px;
padding-left: 10px;
padding-right: 45px;
min-width: 233px;
}
}
Your browser information:
User Agent is: 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:
Technical Documentation Page - Build a Technical Documentation Page
