Technical Documentation Page - my headers are empty?

I get the following errors, it seems very weird, I checked typos, but can’t find any.

“None of your header elements should be empty.”

“Each .nav-link should have text that corresponds to the header text of its related section (e.g. if you have a “Hello world” section/header, your #navbar should have a .nav-link which has the text “Hello world”).”

WARNING

Your browser information:

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

Challenge: Technical Documentation Page - Build a Technical Documentation Page

Link to the challenge:

Please post your html code here for review.

<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=0.1">
    <title>Documentacion Tecnica</title>
    <link rel="stylesheet" href="./styles.css">
</head>
<body>
    <nav id="navbar">
        <header id="nav-header">Menu</header>
        <a class="nav-link" href="#Overwatch">Overwatch</a>
        <a class="nav-link" href="#Objetivo">Objetivo</a>
        <a class="nav-link" href="#Roles">Roles</a>
        <a class="nav-link" href="#Heroes">Heroes</a>
        <a class="nav-link" href="#Percepcion">Percepcion</a>
    </nav>
    <main id="main-doc">
        <hr>
        <section id="Overwatch" class="main-section">
            <header id="ow">Overwatch</header>
        <code>.</code>
        <code>.</code>
        <code>.</code>
        <code>.</code>
        <code>.</code>
            <p>
                Overwatch es un <strong>deporte electronico</strong> lanzado por Blizzard donde dos
                equipos de cinco personas se enfrentan en un campo de batalla utilizando heroes en una perspectiva de
                primera persona.
            </p>
        </section>
        <hr>
        <section id="Objetivo" class="main-section">
            <header>Objetivo</header>
            <p>
                El objetivo depende del modo de juego:
            <ol>
                <li>Empuje: el objetivo es llevar un robot ubicado en el medio al extremo contrario del mapa, en caso de
                    que se acabe el tiempo, gana el que empujo mas lejos al robot.</li>
                <li>
                    Control: el primero en conseguir dos puntos, consiste en capturar al 100% el area del medio
                    (desbloquea a los 20s del comienzo de la ronda) esta ira incrementando 1% por segundo al contador
                    del equipo que posea el objetivo.
                </li>
                <li>
                    Carga: el equipo atacante empuja una carga por un recorrido dividido en 3 puntos, en caso de
                    lograrlo, se guarda el tiempo
                    restante a su banco de tiempo para la proxima ronda, en caso de una defensa queda empujar mas lejos
                    que el otro equipo.
                </li>
                <li>Hibrido: es la combinacion de control y carga, necesitando primero capturar un punto para
                    desbloquear la carga. Este siendo el unico modo que puede haber empate</li>
            </ol>
        </p>
            <p>
            <i>En caso de que no se cumpla el objetivo al finalizar el tiempo y se encuentre en disputa se activa el
                tiempo extra.</i>
            </p>
        </section>
        <hr>
        <section id="Roles" class="main-section">
            <header>Roles</header>
            <p>
            El equipo esta divido en tres roles distintos: un tanque, dos soporte y dos de daño.
            </p>
            <p>
            <ul>
                <li>Daño:                Posee por sobre todo caracteristicas ofensivas, su deber es conseguir ventaja numerica o presionar al
                enemigo a base de daño, pasivamente ganan velocidad de movimiento y recarga despues de una eliminacion.</li>
                <li>Tanque:                Su objetivo es conseguir ventaja posicional generando espacios presionando al enemigo, ademas de evitar
                amenazas, pasivamente poseen resistencia a desposicionamientos.</li>
                <li>Soporte:                Brindan curacion y utilidad, alterando la efectividad de los heroes, ya sea contrarestando jugadas o
                posibilitandolas, se curan automaticamente despues de no recibir daño.</li>
            </ul>
        </p>
        </section>
        <hr>
        <section id="Heroes" class="main-section">
            <header>Heroes</header>
            <p>
                Actualmente hay 36 heroes disponibles, los jugadores pueden cambiar de heroe en las zonas de
                reaparicion, respetando el rol elegido.
            </p>
            <p>
                Los heroes pueden variar en:
            <ul>
                <li>Tamaño: Afectando la facilidad de recibir daño</li>
                <li>Cantidad y tipo de vida: normal (blanco), escudo (celeste): se regenera despues de no recibir daño,
                    armadura (amarillo): se reduce el daño recivido(siendo mas eficaz contra algunos tipos de daño)
                    escudos temporarios: (verde). </li>
                <li>Daño: instantaneo, proyectil, laser, daño en area o daño sobre tiempo. Cantidad de municion, Patron
                    de disparo. </li>
                <li>Habilidades: pasivas, definitivas, movilidad, desplazamiento o inmovilizacion,
                    alteracion de estadisticas, colocacion de obstaculos, torretas o portales,
                    invulneravilidad, invisivilidad, bloqueo, reflejo o absorcion de daño, o de deteccion.
            </ul>
            </p>
        </section>
        <hr>
        <section id="Percepcion" class="main-section">
            <header>Percepcion</header>
            <p>
                Es necesario entender que la percepción, comprension y reaccion de las circunstancias se aprende con la
                incorporación de hábitos y se trabajar en una linea de pensamiento, que es influida por
                la personalidad, conocimiento y habilidades de percepción. Cuando un jugador observa o escucha algo
                relevante, le roba atencion y le indica un grado de ventaja o desventaja, que al evaluarse, se decide
                como reaccionar.
                La linea de pensamiento de observacion, orientacion, decision y actuacion usualmente se realiza
                reiteradas veces a un ritmo acelerado impuesto por el ritmo del juego.
            </p>
            <p>
            El trabajo en equipo es escencial y la coordinacion determinante.
            Naturalmente cada pelea posee las siguientes fases de batalla:
            <ul>
                <li>Acercamiento</li>
                <li>Iniciación</li>
                <li>Intercambio</li>
                <li>Limpieza</li>
            </ul>
            </p>
            <p> Ademas de la ventaja de objetivos/puntos, en la pelea hay tres tipos de ventajas:
            <ul>
                <li>Numérica: cantidad de heroes vivos.</li>
                <li>Posicional: posición en el mapa de los equipos.</li>
                <li>Económica: cantidad de habilidades disponibles.</li>
            </ul>
<p>
            Ya sea premeditada o instintivamente, se consigue atravez de jugadas,
            como castigar o forzar un posicionamiento desfavorable, forzar o aprovechar el uso de una habilidad clave.
            generalmente estas ponen en riesgo ventajas para ganar ventaja como recompensa.
            al fin y al cabo estas es para lograr la ventaja numerica, y esta para capturar el objetivo.</p>

            <p>            
                Para mencionar ventajas, para preocuparse imprevistos, o ejecutar un plan cordinadamente se requiere una comunicacion.
                Se requiere para la eleccion de una estrategia o composicion coherente, o retroalimentar que no esta funcionando.
                Para una comunicacion eficaz, idealmente debe ser precisa y relevante, tambien evitar mencionar lo que se puede 
                comunicar atravez del juego, salvo que sea crucial, esto logra generar una linea limpia de pensamiento grupal.
                La comuncacion bien lograda puede ser la diferencia ganadora mas facil por arriba de las mecanicas,
                ya que posibilita generar o prevenir jugadas, es decir, llevar a cabo la tactica y estrategia.
                Para aclarar la diferencia de estas dos ultimas, me gusta parafrasear a kasparov:<br>
                <center><quote><i>La tactica ocurre cuando hay algo evidente, la estrategia viene cuando no</i></quote></center>
            </p>
        </section>
    </main>
</body>
</html>

One problem I see is that you have nested ul elements inside p elements and that is not allowed.
Try closing your p element before you open a new ul element (you have done that multiple times).

Thanks, although I still get the errors

can you share the new code? There were multiple such issues so I hope you were able to fix them all.

<!DOCTYPE html>
<html lang="es">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=0.1">
    <title>Documentacion Tecnica</title>
    <link rel="stylesheet" href="./styles.css">
</head>

<body>
    <nav id="navbar">
        <header id="nav-header">GroupUp</header>
        <a class="nav-link" href="#Overwatch">Overwatch</a>
        <a class="nav-link" href="#Objetivo">Objetivo</a>
        <a class="nav-link" href="#Roles">Roles</a>
        <a class="nav-link" href="#Heroes">Heroes</a>
        <a class="nav-link" href="#Percepcion">Percepcion</a>
    </nav>
    <main id="main-doc">
        <hr>
        <section id="Overwatch" class="main-section">
            <header id="ow">Overwatch</header>
            <p>
                Overwatch es un <strong>deporte electronico</strong> lanzado por Blizzard donde dos
                equipos de cinco personas se enfrentan en un campo de batalla utilizando heroes en una perspectiva de
                primera persona.
            </p>
        </section>
        <hr>
        <section id="Objetivo" class="main-section">
            <header>Objetivo</header>
            <p>
                El objetivo depende del modo de juego:
            </p>
            <ol>
                <li>Empuje: el objetivo es llevar un robot ubicado en el medio al extremo contrario del mapa, en caso de
                    que se acabe el tiempo, gana el que empujo mas lejos al robot.</li>
                <li>
                    Control: el primero en conseguir dos puntos, consiste en capturar al 100% el area del medio
                    (desbloquea a los 20s del comienzo de la ronda) esta ira incrementando 1% por segundo al contador
                    del equipo que posea el objetivo.
                </li>
                <li>
                    Carga: el equipo atacante empuja una carga por un recorrido dividido en 3 puntos, en caso de
                    lograrlo, se guarda el tiempo
                    restante a su banco de tiempo para la proxima ronda, en caso de una defensa queda empujar mas lejos
                    que el otro equipo.
                </li>
                <li>Hibrido: es la combinacion de control y carga, necesitando primero capturar un punto para
                    desbloquear la carga. Este siendo el unico modo que puede haber empate</li>
            </ol>

            <p>
                <i>En caso de que no se cumpla el objetivo al finalizar el tiempo y se encuentre en disputa se activa el
                    tiempo extra.</i>
            </p>
            <code>.</code>
            <code>.</code>
            <code>.</code>
            <code>.</code>
            <code>.</code>
        </section>
        <hr>
        <section id="Roles" class="main-section">
            <header>Roles</header>
            <p>
                El equipo esta divido en tres roles distintos: un tanque, dos soporte y dos de daño.
            </p>

            <ul>
                <li>Daño: Posee por sobre todo caracteristicas ofensivas, su deber es conseguir ventaja numerica o
                    presionar al
                    enemigo a base de daño, pasivamente ganan velocidad de movimiento y recarga despues de una
                    eliminacion.</li>
                <li>Tanque: Su objetivo es conseguir ventaja posicional generando espacios presionando al enemigo,
                    ademas de evitar
                    amenazas, pasivamente poseen resistencia a desposicionamientos.</li>
                <li>Soporte: Brindan curacion y utilidad, alterando la efectividad de los heroes, ya sea contrarestando
                    jugadas o
                    posibilitandolas, se curan automaticamente despues de no recibir daño.</li>
            </ul>

        </section>
        <hr>
        <section id="Heroes" class="main-section">
            <header>Heroes</header>
            <p>
                Actualmente hay 36 heroes disponibles, los jugadores pueden cambiar de heroe en las zonas de
                reaparicion, respetando el rol elegido.
            </p>
            <p>
                Los heroes pueden variar en:
            </p>
            <ul>
                <li>Tamaño: Afectando la facilidad de recibir daño</li>
                <li>Cantidad y tipo de vida: normal (blanco), escudo (celeste): se regenera despues de no recibir daño,
                    armadura (amarillo): se reduce el daño recivido(siendo mas eficaz contra algunos tipos de daño)
                    escudos temporarios: (verde). </li>
                <li>Daño: instantaneo, proyectil, laser, daño en area o daño sobre tiempo. Cantidad de municion, Patron
                    de disparo. </li>
                <li>Habilidades: pasivas, definitivas, movilidad, desplazamiento o inmovilizacion,
                    alteracion de estadisticas, colocacion de obstaculos, torretas o portales,
                    invulneravilidad, invisivilidad, bloqueo, reflejo o absorcion de daño, o de deteccion.
            </ul>

        </section>
        <hr>
        <section id="Percepcion" class="main-section">
            <header>Percepcion</header>
            <p>
                Es necesario entender que la percepción, comprension y reaccion de las circunstancias se aprende con la
                incorporación de hábitos y se trabajar en una linea de pensamiento, que es influida por
                la personalidad, conocimiento y habilidades de percepción. Cuando un jugador observa o escucha algo
                relevante, le roba atencion y le indica un grado de ventaja o desventaja, que al evaluarse, se decide
                como reaccionar.
                La linea de pensamiento de observacion, orientacion, decision y actuacion usualmente se realiza
                reiteradas veces a un ritmo acelerado impuesto por el ritmo del juego.
            </p>
            <p>
                El trabajo en equipo es escencial y la coordinacion determinante.
                Naturalmente cada pelea posee las siguientes fases de batalla:
            </p>

            <ul>
                <li>Acercamiento</li>
                <li>Iniciación</li>
                <li>Intercambio</li>
                <li>Limpieza</li>
            </ul>

            <p> Ademas de la ventaja de objetivos/puntos, en la pelea hay tres tipos de ventajas:
            </p>
            <ul>
                <li>Numérica: cantidad de heroes vivos.</li>
                <li>Posicional: posición en el mapa de los equipos.</li>
                <li>Económica: cantidad de habilidades fdisponibles.</li>
            </ul>
            <p>
                Ya sea premeditada o instintivamente, se consigue atravez de jugadas,
                como castigar o forzar un posicionamiento desfavorable, forzar o aprovechar el uso de una habilidad
                clave.
                generalmente estas ponen en riesgo ventajas para ganar ventaja como recompensa.
                al fin y al cabo estas es para lograr la ventaja numerica, y esta para capturar el objetivo.
            </p>
            <p>
                Para mencionar ventajas, para preocuparse imprevistos, o ejecutar un plan cordinadamente se requiere una
                comunicacion.
                Se requiere para la eleccion de una estrategia o composicion coherente, o retroalimentar que no esta
                funcionando.
                Para una comunicacion eficaz, idealmente debe ser precisa y relevante, tambien evitar mencionar lo que
                se puede
                comunicar atravez del juego, salvo que sea crucial, esto logra generar una linea limpia de pensamiento
                grupal.
                La comuncacion bien lograda puede ser la diferencia ganadora mas facil por arriba de las mecanicas,
                ya que posibilita generar o prevenir jugadas, es decir, llevar a cabo la tactica y estrategia.
                Para aclarar la diferencia de estas dos ultimas, me gusta parafrasear a kasparov:<br>
                <center>
                    <quote><i>La tactica ocurre cuando hay algo evidente, la estrategia viene cuando no</i></quote>
                </center>
            </p>
        </section>
    </main>
</body>

</html>

looks like the issue is in your css, as this html code passes for me with someone else’s css code.

1 Like

Big hint, thank you!

1 Like

I had I typo on the media query, changed it from max, to min

@media only screen and (max-width: 600px) {
#navbar{
position: absolute;
visibility: hidden;
}
}

1 Like

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