Table shows neither rows nor columns with bootstrap

Question

I’m trying to make a table with bootstrap. It turns out that some things don’t work.

1. The size of the TD’s are always the same.
2. I can’t create rows to separate rows and columns, like a grid.
3. I took a grid option with bootstrap, but in the same way I cannot create rows and columns.

Below my code to build the table:

<div id="tabela" class="container">
    <table class="table table-hover table-bordered table-striped" border="0">
        <thead>
            <tr>
                <th>Nome</th>
                <th>E-mail</th>
                <th>Endereço</th>
                <th>Bairro</th>
                <th>Cidade</th>
                <th>Estado</th>
                <th>Telefone</th>
                <th>Celular</th>
            </tr>
        </thead>
        <tbody id="tbcadastro">
            <tr>
                <td>Nome</td>
                <td>E-mail</td>
                <td>Endereço</td>
                <td>Bairro</td>
                <td>Cidade</td>
                <td>Estado</td>
                <td>Telefone</td>
                <td>Celular</td>
            </tr>
        </tbody>
    </table>
</div>

Answer 1

The problem is because you’re asking

border=0

in the table definition. remove and you will see the result!

if you are using bootstrap 3 it is easy for you to control the size of the columns using the grid classes ex: col-Sm-2 for example.

abuse of these classes are usually very useful