Build A Technical Documentation Page

I did write the code correctly as instructed and I have passed all the testes except the one that says" 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 couldn’t figure it out the mistake, can you please help me to fix it .
Thank you!

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="styles.css">
  <title>Technical documentation on Python</title>
</head>
<body>
  <main id="main-doc">
    <div class="section-div">
      <section class="main-section" id="python_get_started">
        <header class="main-header">Python Get-Started</a></header>
        <p>Getting started with Python is simple and straightforward, making it an excellent choice for beginners and experienced developers alike.</p>
        <p>Python is an interpreted, high-level programming language known for its readability and versatility.</p>
        <p>To begin, you'll need to install Python on your computer, which you can download from the official Python website.</p>
        <p>Once installed, you can write Python code using any text editor or an Integrated Development Environment (IDE) like PyCharm or VS Code.</p>
        <p>Python's syntax is clear and easy to understand, with a focus on readability, which allows you to write less code to accomplish tasks compared to other languages.</p>
        <p>To start coding, you can open your terminal or command prompt, type python, and begin experimenting with simple commands like print("Hello, World!").</p>
        <code>print('Hello world')</code>
      </section>
      
      <section class="main-section" id="python_syntax">
        <header class="main-header">Python Syntax</header>
        <p>The get() method in Python is commonly used with dictionaries to retrieve the value for a given key.</p>
        <p>It’s a safe way to access dictionary elements because it doesn’t throw a KeyError if the key is not found.</p>
        <p>Instead, it returns None (or a specified default value) if the key doesn’t exist.</p>
        <p>Here's a basic example:</p>
        <code>my_dict = {'name': 'Alice', 'age': 30}<br>...</code>
        <p>Here are some syntaxes:</p>
        <ul>
          <li>Variable Assignment:</li>
          <li>Conditional Statements:</li>
          <li>Loops:</li>
          <li>Function Definition:</li>
          <li>List Comprehension:</li>
          <li>Importing Modules:</li>
          <li>Class Definition:</li>
          <li>Exception Handling:</li>
        </ul>
      </section>
      
      <section class="main-section" id="python_comment">
        <header class="main-header">Python Comment</header>
        <p>In Python, comments are used to explain code and make it more understandable for anyone reading it, including your future self.</p>
        <p>They are especially helpful when the code is complex or when you want to clarify why a particular approach was taken.</p>
        <p>Comments are ignored by the Python interpreter, meaning they have no effect on the execution of the program.</p>
        <p>To write a comment in Python, you use the # symbol. Anything following this symbol on the same line is considered a comment.</p>
        <code># This function calculates the factorial of a number<br>...</code>
      </section>
      
      <section class="main-section" id="python_variable">
        <header class="main-header">Python Variable</a></header>
        <p>In Python, variables are used to store data that can be referenced and manipulated throughout a program.</p>
        <p>A variable in Python is created by assigning a value to a name, using the = operator.</p>
        <p>The data type of the variable is inferred automatically based on the value assigned, meaning you don't need to explicitly declare the type.</p>
        <p>For example:</p>
        <code># Assigning values to variables<br>...</code>
      </section>
      
      <section class="main-section" id="python_data_type">
        <header class="main-header">Python Data Type</header>
        <p>Python has several built-in data types that are used to store different kinds of information.</p>
        <p>The most common data types include:</p>
        <ul>
          <li>Integer (int): Represents whole numbers</li>
          <li>Floating-Point (float): Represents decimal numbers.</li>
          <li>String (str): Represents a sequence of characters (text).</li>
          <li>Boolean (bool): Represents True or False values.</li>
          <li>List (list): Represents an ordered collection of items (can be of mixed types).</li>
          <li>Tuple (tuple): Similar to a list, but immutable (cannot be changed).</li>
          <li>Dictionary (dict): Represents a collection of key-value pairs.</li>
          <li>Set (set): Represents an unordered collection of unique items.</li>
          <li>NoneType (None): Represents the absence of a value.</li>
        </ul>
        <code># Integer and Float<br>...</code>
      </section>
    </div>

    <nav id="navbar">
      <header>Python Documentation</header>
      <a href="#python_get_started" class="nav-link">Python Get-Started</a>
      <a href="#python_syntax" class="nav-link">Python Syntax</a>
      <a href="#python_comment" class="nav-link">Python Comment</a>
      <a href="#python_variable" class="nav-link">Python Variable</a>
      <a href="#python_data_type" class="nav-link">Python Data Type</a>
    </nav>
  </main>
</body>
</html>
```

Hi there!

I have edited your topic’s title to exact title matches with your code. And also added the link to that challenge project.

Tell if there is a solution for my problem

Hello,
have a look at the first section and its header again. You have an underscore in one and a hyphen in the other:)

1 Like

In above section’s id value and header text didn’t matches. You need to add underscore in id only for white space. Also the latter casing should be same for header text and the id attribute value. Check all your section IDs value, header text and anchors element href value and text.

2 Likes