Technical Documentation Page - Build a Technical Documentation Page

HTML-CSS
1

Tell us what’s happening:

Im not sure what I am misunderstanding : 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.

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>Mixing Audio in Pro Tools</title>
    <link rel="stylesheet" href="styles.css"> <!-- Link to the external CSS file -->
</head>
<body>

    <nav id="navbar">
        <header>Navigation</header>
        <a class="nav-link" href="#setup">Set Up Your Session</a>
        <a class="nav-link" href="#organize">Organize Your Tracks</a>
        <a class="nav-link" href="#adjust">Adjust Track Levels</a>
        <a class="nav-link" href="#apply">Apply EQ and Compression</a>
        <a class="nav-link" href="#automation">Automation</a>
    </nav>

    <main id="main-doc">

        <section class="main-section" id="setup">
            <header class="main_header" id="setup">Set Up Your Session</header>
            <p>Open Pro Tools and create a new session or open an existing one.</p>
            <p>Import your audio tracks:</p>
            <pre>File &gt; Import &gt; Audio...</pre>
            <p>Ensure that your session settings are configured correctly for your project needs.</p>
        </section>

        <section class="main-section" id="organize">
            <header id="organize">Organize Your Tracks</header>
            <p>Label and color-code your tracks for better organization.</p>
            <p>You can right-click on a track to access the color options.</p>
            <p>Consider grouping similar tracks together to simplify mixing.</p>
        </section>

        <section class="main-section" id="adjust">
            <header id="adjust">Adjust Track Levels</header>
            <p>Use the faders to set the initial volume levels of each track.</p>
            <p>Make sure no tracks are peaking in the red.</p>
            <ul>
                <li>Use the mixer view for easier adjustments.</li>
                <li>Check levels visually and audibly.</li>
                <li>Adjust individual track levels as needed.</li>
            </ul>
        </section>

        <section class="main-section" id="apply">
            <header id="apply">Apply EQ and Compression</header>
            <p>Enhance your audio using EQ and compression:</p>
            <pre>Select a track &gt; Insert &gt; EQ or Dynamics</pre>
            <p>Adjust the settings according to the sound you want to achieve.</p>
            <p>Experiment with different EQ settings to find the right balance for your mix.</p>
        </section>

        <section class="main-section" id="automation">
            <header id="automation">Automation</header>
            <p>Automate volume, panning, and effects to create dynamic changes throughout the mix:</p>
            <ul>
                <li>Select the track.</li>
                <li>Click on the <strong>Automation</strong> button in the track header.</li>
                <li>Choose the parameter you want to automate (e.g., Volume).</li>
            </ul>
            <p>Automation can help your mix evolve and add interest over time.</p>
        </section>

    </main>

</body>
</html>


<!-- file: index.html -->


/* file: styles.css */

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.13; rv:109.0) Gecko/20100101 Firefox/115.0

Challenge Information:

Technical Documentation Page - Build a Technical Documentation Page

1 Like
2

The id of each main-section, for eg here it is “setup” must match the text of the first child which in this case is Set Up Your Session.

That is not a match: so you need to fix this and any other similar issue

Also: all id values should be unique in the document. Please don’t reuse them.

2 Likes
3

aaahh. thanks man. I appreciate you.

2 Likes