twitter bootstrap - modal - ¿Cómo utilizar el sistema de rejilla Bootstrap 3 con componente de tabla?
tablas bootstrap 4 (1)
Elimine la clase de row de sus elementos <tr> . Esa clase hace que un elemento que no sea una fila de tabla se vea como una fila de tabla y agrega algunos estilos que rompen un estándar <tr> . Todavía puedes usar las clases "col" como normal:
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<table class="table table-bordered">
<tr>
<td class="field-label col-xs-3 active">
<label>Field 1:</label>
</td>
<td class="col-md-9">
Value 1
</td>
</tr>
<tr>
<td class="field-label col-xs-3 active">
<label>Field 2:</label>
</td>
<td class="col-md-9">
Value 2
</td>
</tr>
<tr>
<td class="field-label col-xs-3 active">
<label>Field 3:</label>
</td>
<td class="col-md-9">
Value 3
</td>
</tr>
</table>
He iniciado una migración al sistema grid utilizando Bootstrap 3, pero los ejemplos en la documentación son todos utilizando DIV: http://getbootstrap.com/css/#grid
Hice un código algo redundante que mezcla las clases DIV con las etiquetas / clases TABLE: http://getbootstrap.com/css/#tables
El problema es que el diseño duplica los bordes y creo que debería ser una mejor manera de hacerlo. ¿Alguna recomendación sobre eso?
Un código de ejemplo en Fiddle: http://jsfiddle.net/7g8nV/1/
<div class="table-responsive">
<table class="table table-bordered">
<tr class="row">
<td class="field-label col-md-3 active">
<label>Field 1:</label>
</td>
<td class="col-md-9">
Value 1
</td>
</tr>
<tr class="row">
<td class="field-label col-md-3 active">
<label>Field 2:</label>
</td>
<td class="col-md-9">
Value 2
</td>
</tr>
<tr class="row">
<td class="field-label col-md-3 active">
<label>Field 3:</label>
</td>
<td class="col-md-9">
Value 3
</td>
</tr>
</table>
</div>
Gracias por adelantado.