2
respostas

Coloquei rodapé e o css não configura certo

Eu tentei criar classes para configurar diferente o rodapé da tabela (pra ficar sem bordas) e não estou conseguindo acertar o CSS.

Podem me ajudar?

<table>
            <thead class="cabecalho">
                <tr>
                    <th>Dia</th>
                    <th>Horário</th>
                </tr>
            </thead>

            <tbody class="corpo">
                <tr>
                    <td>Segunda-feira</td>
                    <td>8 ~ 20h</td>
                </tr>
                <tr>
                    <td>Quarta-feira</td>
                    <td>8 ~ 20h</td>
                </tr>
                <tr>
                    <td>Sexta-feira</td>
                    <td>8 ~ 20h</td>
                </tr>
            </tbody>

            <tfoot class="rodape">
                <td>*horários referentes a 2020<td>
            </tfoot>
        </table>
table {
    margin: 20px 0 40px;
}

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

.cabecalho {
    border: 1px solid #000000;
    padding: 8px 15px;
}

.corpo {
    border: 1px solid #000000;
    padding: 8px 15px;
}

.rodape {
    border: none;
    padding: 8px 15px;
}```
2 respostas

Oi Loraine, acho que não entendi direito sua duvida, abri no meu pc e não vi borda alguma. Você esta falando que queria que o "*horários referentes a 2020" ocupasse toda a parte de baixo da tabela e não apenas a primeira coluna?

Caso seja essa a duvida isso é feito no próprio html com a propriedade colspan:

            <tfoot class="rodape">
                <td colspan="2">*horários referentes a 2020<td>
            </tfoot>

Vc esqueceu a tag tr. Deve ser isso

<tfoot class="rodape">
    <tr>
                <td>*horários referentes a 2020<td>
    </tr>
     </tfoot>