1
resposta

Deu algum erro? Alguém pode me ajudar?

Clicando encima do Email e o WhatsApp eles marcam, do telefone não. E depois de criar o imput dentro da label do “Gostaria de receber nossas novidades por Email? “, ele não aparece na minha página.

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Contato - Barbearia Alura</title>

        <link rel="stylesheet" href="reset.css">
        <link rel="stylesheet" href="style.css">
    </head>
    <body>
        <header>
            <div class="caixa">
            <h1><img src="logo.png"></h1>

                <nav>
                    <ul>
                        <li><a href="index.html">Home</a></li>
                        <li><a href="produtos.html">Produtos</a></li>
                        <li><a href="contato.html">Contato</a></li>
                    </ul>
                </nav>
            </div>
        </header>

        <main>
            <form>
                <label for="nomesobrenome">Nome e sobrenome</label>
                <input type="text" id="nomesobrenome">

                <label for="email">Email</label>
                <input type="text" id="email">

                <label for="telefone">Telefone</label>
                <input type="text" id="telefone">

                <label for="mensagem">Mensagem</label>
                <textarea cols="70" rows="10" id="mensagem"></textarea>

                <div>
                    <p>Como prefere o nosso contato?</p>
                    <label for="radio-email">Email</label>
                    <input type="radio" name="contato" value="email" id="radio-email">

                    <label for="radio-telefone">Telefone</label>
                    <input type="radio" name="contato" value="telefone" id="radio-telefone ">

                    <label for="radio-whatsapp">WhatsApp</label>
                    <input type="radio" name="contato" value="whatsapp" id="radio-whatsapp">
                </div>

                <label><input type="checkbox>" Gostaria de receber nossas novidades por Email?</label>


                <input type="submit" value="Enviar formulário">
            </form>
        </main>


        <footer>
            <img src="logo-branco.png">
            <p class="copyright">&copy; Copyrith Barbearia Alura 2022</p>
        </footer>
    </body>
</html>
1 resposta

Bruno, eu testei o seu código aqui, e quando você clica em cima da palavra "telefone" e o checkbox não e marcado, e porque dentro da tag input, tem o id e no final da palavra "radio-telefone" tem um pequeno espaçamento, entro o final da palavra e o fechamento das aspas. Se você analisar bem, entre o final da palavra e o fechamento das aspas tem um espaço d="radio-telefone ", por isso ao clicar em cima da palavra telefone o check não e marcado. Coloque assim id="radio-telefone", que ira da certo.

Em relação a não aparecer a mensagem "Gostaria de receber nossas novidades por Email?" e porque você fechou as aspas depois da tag input ,<input type="checkbox>". Dessa forma, ocorre um erro, corrigindo isso a mensagem ira aparecer.

Espero ter lhe ajudado, e espero que minha explicação tenha sido clara. Se não tiver entendido algo, fica a vontade para perguntar que a gente vai aprendendo juntos. Tudo de bom, Bruno.