Tem como eu criar uma tabela com Bootstrap e fixar o tamanho de cada <td>
? Gostaria de poder flexibilizar o tamanho das células de uma tabela com Bootstrap, é possível?
1 Resposta
Para tabelas você pode utilizar o mesmo padrão da divisão de div
.
<tr class='row'>
<td class="col-xs-2 col-sm-2 col-md-2 col-lg-2">col 1</td>
<td class="col-xs-4 col-sm-4 col-md-4 col-lg-4">col 2</td>
<td class="col-xs-6 col-sm-6 col-md-6 col-lg-6">col 3</td>
</tr>
Veja Grid Options para entender melhor a divisão de grids
-
Minha dificuldade é entender o sm, md, xs e lg. Ainda não consegui entender esses caras.– pnet26/06/2014 às 18:53
-
@pnet veja este link caelum.com.br/apostila-html-css-javascript/…", talvez ajude você entender a divisão de grids, procure na página por: 11.14 - Grid responsivo do Bootstrap– abfurlan26/06/2014 às 18:59
-
3@pnet, o sm, md, xs e lg tem a ver com o tamanho da tela do usuário, onde resumidamente sm = tela pequena, md = media, xs = super pequena, lg = grande (veja aqui com mais detalhes: getbootstrap.com/css/#grid-options ). Utilizando essas classes você controla como o conteúdo aparece em cada tamanho de tela. Lembrando que 100% da largura de uma row são 12 colunas, este exemplo
<div class="col-xs-12 col-md-6"> </div>
-> vai ocupar as 12 colunas [100%] em uma tela pequena (xs) e 6 colunas [50%] em uma tela média (md).– Ana Rute27/06/2014 às 13:40