[Dúvida] css n está funcionando junto do html | HTML5 e CSS3 parte 3: trabalhando com formulários e tabelas

Solucionado (ver solução)

Solucionado
(ver solução)

2
respostas

por Emanuel Nabarrete de Souza

| 55.1k xp | 38 posts

Aprendiz

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

<fieldset>        
            <legend>Qual horário prefere ser atendido?</legend>
            <select>
            <option>Manhã</option>
            <option>Tarde</option>
            <option>Noite</option>
</select>

</fieldset>

            <label class="check"><input type="checkbox"checked> Gostaria de receber novidades via email?</label>


            <input type="submit" value="Enviar formulario" class="enviar" >
</form>
</main> 
<table>
    <thead>
        <tr>
            <th>Dia</th>
            <th>Horário</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Segunda</td>
            <td>8h ~ 20h</td>
        </tr>
        <tr>
            <td>Quarta</td>
            <td>8h ~ 20h</td>
        </tr>
        <tr>
            <td>Sexta</td>
            <td>8h ~ 20h</td>
        </tr>
    </tbody>
</table>

        <footer>
            <img src="logo-branco.png" alt="logo barbearia alura">
            <p class="copyright">&copy; Copyright Barbearia Alura - 2019</p>
        </footer>
    </body>
    </html>

CSS

table{
    margin: 20px  25%;
}

thead{

    background: grey;
    font-weight: bold;

}
td , th{
    border: 1px solid #000000;
}

Não está indo o css

2 respostas

solução!

por Bruno Henrique Souza Gondim

| 38.9k xp | 2 posts

Supervisor Administrativo

12/12/2022

Olá, o seu código para representar a tabela está fora da tag <main> </main>?

Fiz um teste aqui e retirei o meu código da tabela da tag e o comportamento ficou igual ao seu:

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

por Alexandre do Nascimento Teixeira Junior

| 16.2k xp | 1 posts

12/12/2022

Primeiro sua table está fora do

e por isso está desalinhado, e na verdade. seu CSS está a funcionar, olha a cor do background do

Eu utilizei esses estilos no meu CSS para construir a table:

table, table tr, table td{
    margin: 20px 0 40px;
    border: solid 2px grey;
    padding: 20px 30px;
}

thead{
    background-color: #c4c4c4;
    font-weight: bold;
}