Skip to main content
2 de 3
tradução
hugocsl
  • 66,9mil
  • 17
  • 88
  • 166

Label e Checkbox não estão funcionando

Eu criei uma caixa de seleção com o id = "navToggle" para mostrar o "nav" e pretendia usar a label com o for apontando para esse checkbox, mas por algum motivo quando eu clico no X nada acontece. O checkbox funciona bem. Abaixo, há o código css3 que eu usei para mostrar o menu quando checkbox está marcado e, em seguida, há o HTML. Por favor ajude. Obrigado.

.nav-toggle:checked ~ nav{
    display: block;
}
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>FirstPage</title>

</head>
<body>
    <link rel="stylesheet" href="navMenuStyle.css" />
    <header>
        <h1 class="logo">S.Gibas</h1>
        <input type="checkbox" class="nav-toggle" id="navToggle" />
        <nav>
            <ul>
                <li><a href="#">Home</a></li>
                <li><a href="#">About Us</a></li>
                <li><a href="#">Contacts</a></li>
                <li><a href="#">News</a></li>
            </ul>
        </nav>
        <lable for="navToggle" class="nav-toggle-lable">
          <span>X</span>
      </lable>
    </header>
</body>
</html>

Caput
  • 21
  • 2