Learn Accessibility by Building a Quiz - Step 16

Tell us what’s happening:
I’m stuck, idk if it’s a bug.

The error hint said :
“You should give the second section element an aria-labelledby attribute of html-questions.”

But I checked it many times. I did exactly (I’m sure) how it’s supposed to be written.

HTML Questions

sorry for my English, please help me :cry:

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="description" content="freeCodeCamp Accessibility Quiz practice project" />
    <title>Accessibility Quiz</title>
    <link rel="stylesheet" href="styles.css" />
      <img id="logo" src="https://cdn.freecodecamp.org/platform/universal/fcc_primary.svg">
      <h1>HTML/CSS Quiz</h1>
      <form method="post" action="https://freecodecamp.org/practice-project/accessibility-quiz">
        <section role="region" aria-labelledby="student-info">
                <section role="region" aria-labelledby="student-info">
                <h2 id="student-info">Student Info</h2>
            <section role="region" aria-labelledby="html-questions">
                <h2 id="html-questions">HTML Questions</h2>
            <section role="region" aria-labelledby="css-questions">
                <h2 id="css-questions">CSS Questions</h2>

/* file: styles.css */
body {
  background: #f5f6f7;
  color: #1b1b32;
  font-family: Helvetica;
  margin: 0;

header {
  width: 100%;
  height: 50px;
  background-color: #1b1b32;
  display: flex;

#logo {
  width: max(100px, 18vw);
  background-color: #0a0a23;
  aspect-ratio: 35 / 4;
  padding: 0.4rem;

h1 {
  color: #f1be32;
  font-size: min(5vw, 1.2em);

nav {
  width: 50%;
  max-width: 300px;
  height: 50px;

nav > ul {
  display: flex;
  justify-content: space-evenly;

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/ Safari/537.36

Challenge: Learn Accessibility by Building a Quiz - Step 16

Link to the challenge:

Hey man, you are learning, you can never be sure :sweat_smile:

A tip on how to avoid these mistakes in the future:
Be careful with identation, try that every opening tag has a closing tag matching its identation.

Just an example:

<form ... >
    <section ... >
        <h2 ... >

On your code, there is a section that is repeated twice and an extra closing tag, try to work out which are which. If you ident things properly you will find out immediately, good luck!


This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.