Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Por que minha tabela nao está completa?

To iniciando no html e css, estou tentando fazer uma page simples, mas nao consigo fazer a table ter a formataço correta com todas as linhas da borda. A borda que estou colocando está aparecendo apenas nas laterais e não está fazendo a divisão dos elementos dentro dela. Se alguem conseguir me ajudar agradeço.

Codigo do html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Portifólio</title>
    <link rel="stylesheet" type="text/css" href="reset_css/reset.css">
    <link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
        <!--- AQUI COMEÇA O CABEÇALHO DO PORTIFOLIO-->
        <header class="cabeçalho">
                <img class="imgNav" src="imagens/imgNav.jpg"> <!--FUNDO DA NAVEGAÇÃO-->

                <h1 class="tituloPrincipal">Lorem Ipsum</h1>
                <h2 class="subTituloPrincipal" >Lorem Ipsum Lorem Ipsum</h2>

            <nav class="navegacao">
                <ul class="lista">
                    <li class="listNav"><a href="#">Quem Sou ?</a></li>
                    <li class="listNav"><a href="#">Habilidades</a></li>
                    <li class="listNav"><a href="#">Projetos</a></li>
                    <li class="listNav"><a href="#">Contato</a></li>
                </ul>
            </nav><!--NAVEGACAO--->        
        </header> <!---CABECALHO-->

        <main class="main">
            <section class="secao">
                <p class="apresentacao">Loren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren ipsumLoren  </p> <!-- TEXTO DE APRESENTAÇÃO-->

                <img class="avatar" src="imagens/avatar.jpg"><!--IMAGEM DO AVATAR-->

            </section >

            <!--SECAO DAS HABILIDADES--->
            <section class="secao" id="secao2">
                    <h2 id="habilidades" class="subTitulo">Habilidades</h2>

                <div class="divTabela"><!-- FIZ ESSA DIV PARA VISUALIZAR MELHOR A TABLE--->

                    <table class="tabela"><!--Essa tabela nao fica do jeito que quero-->
                        <thead>
                            <tr>
                                <th>Conhecimentos</th>
                                <th>Nivel de Conhecimento</th>
                            </tr>
                        </thead>
                        <tbody class="conhecimentos">
                            <tr>
                                <td>Html</td>
                                <td>Básico</td>
                            </tr>
                            <tr>
                                <td>Css</td>
                                <td>Básico</td>
                            </tr>
                            <tr>
                                <td>Javascript</td>
                                <td>Básico</td>
                            </tr>
                            <tr>
                                <td>Java</td>
                                <td>Básica</td>
                            </tr>
                        </tbody>
                    </table><!--TABLE CLASS TABELA--->

                <h2 class="subTitulo">Cursos e Certificações</h2>

                <ul>
                    <li>Loren ipsum</li>
                    <li>Loren ipsum</li>
                    <li>Loren ipsum</li>
                    <li>Loren ipsum</li>                    
                </ul>
            </section>

        </main><!---MAIN-->

</body>
</html>

Codigo do css

body{
    background-image: url(../imagens/fundo.jpg);
    background-size: 100%;
    background-attachment: fixed;
}
/*AQUI COMEÇA O CSS DO HEADER E NAV*/
.imgNav{
    width: 100%;
    height: 150px;    
}
.tituloPrincipal{
    margin: 20px;
    font-size: 35px;
    font-weight: bold;
    padding: 10px 10px 0 10px;
    color: white;
}
.subTituloPrincipal{
    margin: 20px;
    font-size: 30px;
    font-weight: bold;
    padding: 0 10px 10px 10px;
    position: absolute;
    top: 195px;
    color: white;
}
.navegacao{
    margin: 35px;
    position: absolute;
    top: 20px;
    right: 500px;
}
.lista li{
    padding: 0 0 0 0;
    display: inline;
    margin: 0 0 0 50px;
}
.listNav:hover{
    text-decoration: underline;
}
.lista a{
    font-size: 28px;
    text-decoration: none;
    color: yellow;
    font-family: Jazz LET, fantasy;
}
a:hover{
    color: #de0404;
    font-size: 38px;
    font-weight: bold;
    font-family:Snell Roundhand, cursive;
}
/*--AQUI COMEÇA O CSS DO MAIN, SECTION E TABELAS*/
.apresentacao{
    color: white;
    margin:20px;
    padding-top: 50px;
    text-align: justify;
    font-size: 23px;
    position: absolute;
    right: 844px;
    font-family: Impact, fantasy;
}
.avatar{
    width: 816px;
    height: 400px;
    position: relative;
    left: 700px;
    top: -87px;
}
.subTitulo{
    color: white;
    font-size: 30px;
    font-weight: bold;
    margin: 20px 0 20px 15px;
    text-align: center;
}
li{
    color: white;
    margin: 10px 0 0 15px;
    font-family: Stencil Std, fantasy;
    font-size: 20px;
    text-align: center;
}
.divTabela{
    background-color: white;
    width: 100%;
    height: 200px;
}
table{
    width: 500px;
    border: 2px solid black;
    margin-left: 520px;
}
1 resposta
solução!

consegui resolver setando as tr e td também

table, tr, td{
    width: 500px;
    border: 2px solid black;
    margin-left: 520px;
}