jquery - verbo - que es correcto fuerces o forces

Fuerce cada fila en la tabla de arranque para que sea unidireccional cuando la tabla es más ancha que la pantalla

Question

Estoy construyendo una tabla dinámica que consta de 1 a 50 columnas, dependiendo de lo que el usuario seleccione. Cuando el usuario selecciona 1-6 columnas, no hay problemas para mostrar los datos en la pantalla (ver ejemplo 1 ), pero cuando el usuario selecciona más de 6 columnas, la tabla intenta comprimir la vista en la pantalla, lo que resulta en que cada fila se expanda a líneas múltiples (ver ex.2 ).

El ancho de la columna no está definido ya que también varía según el texto que se muestre.

¿Cómo puedo asegurarme de que la fila siempre será única como ex.1, sin importar cuántas columnas seleccione el usuario?

Tengo esta demostración de JSFiddle con este código:

<table class=''table''>
<thead>
<tr>
<th>Column 1</th>
<th>Column 2</th>
<th>Column 3</th>
<th>Column 4</th>
<th>Column 5</th>
<th>Column 6</th>
</tr>
</thead>
<tbody>
<tr>
<td>Row 1</td>
<td>Row 11</td>
<td>Row 11 1</td>
<td>Row 11 11</td>
<td>Row 11 11 1</td>
<td>Row 11 11 11</td>
</tr>
<tr>
<td>Row 2</td>
<td>Row 22</td>
<td>Row 22 2</td>
<td>Row 22 22</td>
<td>Row 22 22 2</td>
<td>Row 22 22 22</td>
</tr>
</tbody>
</table>

Answer 1

Intente agregar este CSS a los elementos de su tabla: white-space: nowrap jsFiddle