0

Tenho a seguinte tabela:

  <div class="col-xs-8 col-sm-8 col-md-8 col-lg-8  col-xs-offset-2 col-sm-offset-2 col-md-offset-2 col-lg-offset-2">
    <h3 class=" text-center">Treino 1 para o aluno: Y</h3>
    <table class="table table-striped table-bordered">
      <thead>
        <tr>
          <th class="text-center">Exercício</th>
          <th class="text-center">Distancia</th>
          <th class="text-center">Intervalo</th>
          <th class="text-center">%esf</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <th>Aquecimento</th>
          <td class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
            <div class="centralizar">
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class=" row  col-md-4 ">
                <select class="form-control" id="sel1">
                  <option>25m</option>
                  <option>50m</option>
                  <option>75m</option>
                  <option>100m</option>
                  <option>125m</option>
                  <option>150m</option>
                  <option>200m</option>
                  <option>250m</option>
                  <option>300m</option>
                  <option>350m</option>
                  <option>400m</option>
                  <option>500m</option>
                  <option>600m</option>
                  <option>700m</option>
                  <option>800m</option>
                  <option>900m</option>
                  <option>1000m</option>
                  <option>1500m</option>
                </select>
              </div>
            </div>

          </td>
          <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><input  type="text" class="form-control" id="number"></td>
          <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
            <select class="form-control" id="sel1">
              <option>50%</option>
              <option>60%</option>
              <option>65%</option>
              <option>70%</option>
              <option>80%</option>
              <option>85%</option>
              <option>90%</option>
              <option>100%</option>
            </select>
          </td>
        </tr>
        <tr>
          <th>Alternado</th>
          <td>
            <div class="centralizar">
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class=" row  col-md-4 ">
                <select class="form-control" id="sel1">
                  <option>25m</option>
                  <option>50m</option>
                  <option>75m</option>
                  <option>100m</option>
                  <option>125m</option>
                  <option>150m</option>
                  <option>200m</option>
                  <option>250m</option>
                  <option>300m</option>
                  <option>350m</option>
                  <option>400m</option>
                  <option>500m</option>
                  <option>600m</option>
                  <option>700m</option>
                  <option>800m</option>
                  <option>900m</option>
                  <option>1000m</option>
                  <option>1500m</option>
                </select>
              </div>
            </div>

          </td>
          <td><input  type="text" class="form-control" id="number"></td>
          <td>                    
            <select class="form-control" id="sel1">
              <option>50%</option>
              <option>60%</option>
              <option>65%</option>
              <option>70%</option>
              <option>80%</option>
              <option>85%</option>
              <option>90%</option>
              <option>100%</option>
            </select>
          </td>
        </tr>
        <tr>
          <th>Braços</th>
          <td>
            <div class="centralizar">
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class=" row  col-md-4 ">
                <select class="form-control" id="sel1">
                  <option>25m</option>
                  <option>50m</option>
                  <option>75m</option>
                  <option>100m</option>
                  <option>125m</option>
                  <option>150m</option>
                  <option>200m</option>
                  <option>250m</option>
                  <option>300m</option>
                  <option>350m</option>
                  <option>400m</option>
                  <option>500m</option>
                  <option>600m</option>
                  <option>700m</option>
                  <option>800m</option>
                  <option>900m</option>
                  <option>1000m</option>
                  <option>1500m</option>
                </select>
              </div>
            </div>

          </td>
          <td><input  type="text" class="form-control" id="number"></td>
          <td>                    
            <select class="form-control" id="sel1">
              <option>50%</option>
              <option>60%</option>
              <option>65%</option>
              <option>70%</option>
              <option>80%</option>
              <option>85%</option>
              <option>90%</option>
              <option>100%</option>
            </select>
          </td>
        </tr>
        <tr>
          <th>Resistência</th>
          <td>
            <div class="centralizar">
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class=" row  col-md-4 ">
                <select class="form-control" id="sel1">
                  <option>25m</option>
                  <option>50m</option>
                  <option>75m</option>
                  <option>100m</option>
                  <option>125m</option>
                  <option>150m</option>
                  <option>200m</option>
                  <option>250m</option>
                  <option>300m</option>
                  <option>350m</option>
                  <option>400m</option>
                  <option>500m</option>
                  <option>600m</option>
                  <option>700m</option>
                  <option>800m</option>
                  <option>900m</option>
                  <option>1000m</option>
                  <option>1500m</option>
                </select>
              </div>
            </div>

          </td>
          <td><input  type="text" class="form-control" id="number"></td>
          <td>                    
            <select class="form-control" id="sel1">
              <option>50%</option>
              <option>60%</option>
              <option>65%</option>
              <option>70%</option>
              <option>80%</option>
              <option>85%</option>
              <option>90%</option>
              <option>100%</option>
            </select>
          </td>
        </tr>
        <tr>
          <th>Pernas</th>
          <td>
            <div class="centralizar">
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class=" row  col-md-4 ">
                <select class="form-control" id="sel1">
                  <option>25m</option>
                  <option>50m</option>
                  <option>75m</option>
                  <option>100m</option>
                  <option>125m</option>
                  <option>150m</option>
                  <option>200m</option>
                  <option>250m</option>
                  <option>300m</option>
                  <option>350m</option>
                  <option>400m</option>
                  <option>500m</option>
                  <option>600m</option>
                  <option>700m</option>
                  <option>800m</option>
                  <option>900m</option>
                  <option>1000m</option>
                  <option>1500m</option>
                </select>
              </div>
            </div>

          </td>
          <td><input  type="text" class="form-control" id="number"></td>
          <td>                    
            <select class="form-control" id="sel1">
              <option>50%</option>
              <option>60%</option>
              <option>65%</option>
              <option>70%</option>
              <option>80%</option>
              <option>85%</option>
              <option>90%</option>
              <option>100%</option>
            </select>
          </td>
        </tr>
        <tr>
          <th>Educativo</th>
          <td>
            <div class="centralizar">
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class=" row  col-md-4 ">
                <select class="form-control" id="sel1">
                  <option>25m</option>
                  <option>50m</option>
                  <option>75m</option>
                  <option>100m</option>
                  <option>125m</option>
                  <option>150m</option>
                  <option>200m</option>
                  <option>250m</option>
                  <option>300m</option>
                  <option>350m</option>
                  <option>400m</option>
                  <option>500m</option>
                  <option>600m</option>
                  <option>700m</option>
                  <option>800m</option>
                  <option>900m</option>
                  <option>1000m</option>
                  <option>1500m</option>
                </select>
              </div>
            </div>

          </td>
          <td><input  type="text" class="form-control" id="number"></td>
          <td>                    
            <select class="form-control" id="sel1">
              <option>50%</option>
              <option>60%</option>
              <option>65%</option>
              <option>70%</option>
              <option>80%</option>
              <option>85%</option>
              <option>90%</option>
              <option>100%</option>
            </select>
          </td>
        </tr>
        <tr>
          <th>Progressivo</th>
          <td>
            <div class="centralizar">
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class=" row  col-md-4 ">
                <select class="form-control" id="sel1">
                  <option>25m</option>
                  <option>50m</option>
                  <option>75m</option>
                  <option>100m</option>
                  <option>125m</option>
                  <option>150m</option>
                  <option>200m</option>
                  <option>250m</option>
                  <option>300m</option>
                  <option>350m</option>
                  <option>400m</option>
                  <option>500m</option>
                  <option>600m</option>
                  <option>700m</option>
                  <option>800m</option>
                  <option>900m</option>
                  <option>1000m</option>
                  <option>1500m</option>
                </select>
              </div>
            </div>

          </td>
          <td><input  type="text" class="form-control" id="number"></td>
          <td>                    
            <select class="form-control" id="sel1">
              <option>50%</option>
              <option>60%</option>
              <option>65%</option>
              <option>70%</option>
              <option>80%</option>
              <option>85%</option>
              <option>90%</option>
              <option>100%</option>
            </select>
          </td>
        </tr>
        <tr>
          <th>Regenerativo</th>
          <td>
            <div class="centralizar">
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class=" row  col-md-4 ">
                <select class="form-control" id="sel1">
                  <option>25m</option>
                  <option>50m</option>
                  <option>75m</option>
                  <option>100m</option>
                  <option>125m</option>
                  <option>150m</option>
                  <option>200m</option>
                  <option>250m</option>
                  <option>300m</option>
                  <option>350m</option>
                  <option>400m</option>
                  <option>500m</option>
                  <option>600m</option>
                  <option>700m</option>
                  <option>800m</option>
                  <option>900m</option>
                  <option>1000m</option>
                  <option>1500m</option>
                </select>
              </div>
            </div>

          </td>
          <td><input  type="text" class="form-control" id="number"></td>
          <td>                    
            <select class="form-control" id="sel1">
              <option>50%</option>
              <option>60%</option>
              <option>65%</option>
              <option>70%</option>
              <option>80%</option>
              <option>85%</option>
              <option>90%</option>
              <option>100%</option>
            </select>
          </td>
        </tr>
      </tbody>
    </table>
  </div>

Preciso que no final da tabela a ultima TR seja da largura total da tabela (col-xs-8 col-sm-8 col-md-8 col-lg-8) e que tenha um campo de texto, já tentei varias formas mas não estou conseguindo fazer isso.

Edit1: A tabela em código se encontra na seguinte estrutura: Tabela atual Eu Gostaria de inserir uma nova linha no final da tabela, sendo que essa linha deve ter a largura maxima da tabela dessa forma: inserir a descrição da imagem aqui E por fim nessa ultima linha colocar um text field com a mesma largura dessa linha.

2
  • faça uma demonstração em desenho do que você quer fazer, ou explica de outra forma, não da pra entender direito o que você quer fazer 18/11/2017 às 16:36
  • Um momento, vou desenhar aqui
    – user73316
    18/11/2017 às 16:42

1 Resposta 1

0

Oi, você fez a tabela toda com 4 células em cada linha. O que pode fazer é concatenar as 4 células no final com o colspan="numero de celulas" (que no seu caso é 4)

        <div class="row">
            <tr>
                <td colspan="4">
                    <div class="centralizar">
                        <input type="text" class="form-control" id="seuID">
                    </div>
                </td>
            </tr>
        </div>

Dessa forma, você terá um text field da largura da tabela

Código completo:

<html>
<head>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous">
</head>
<body>
    <div class="col-xs-8 col-sm-8 col-md-8 col-lg-8  col-xs-offset-2 col-sm-offset-2 col-md-offset-2 col-lg-offset-2">
        <h3 class=" text-center">Treino 1 para o aluno: Y</h3>
        <table class="table table-striped table-bordered">
          <thead>
            <tr>
              <th class="text-center">Exercício</th>
              <th class="text-center">Distancia</th>
              <th class="text-center">Intervalo</th>
              <th class="text-center">%esf</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <th>Aquecimento</th>
              <td class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
                <div class="centralizar">
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class=" row  col-md-4 ">
                    <select class="form-control" id="sel1">
                      <option>25m</option>
                      <option>50m</option>
                      <option>75m</option>
                      <option>100m</option>
                      <option>125m</option>
                      <option>150m</option>
                      <option>200m</option>
                      <option>250m</option>
                      <option>300m</option>
                      <option>350m</option>
                      <option>400m</option>
                      <option>500m</option>
                      <option>600m</option>
                      <option>700m</option>
                      <option>800m</option>
                      <option>900m</option>
                      <option>1000m</option>
                      <option>1500m</option>
                    </select>
                  </div>
                </div>

              </td>
              <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><input  type="text" class="form-control" id="number"></td>
              <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
                <select class="form-control" id="sel1">
                  <option>50%</option>
                  <option>60%</option>
                  <option>65%</option>
                  <option>70%</option>
                  <option>80%</option>
                  <option>85%</option>
                  <option>90%</option>
                  <option>100%</option>
                </select>
              </td>
            </tr>
            <tr>
              <th>Alternado</th>
              <td>
                <div class="centralizar">
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class=" row  col-md-4 ">
                    <select class="form-control" id="sel1">
                      <option>25m</option>
                      <option>50m</option>
                      <option>75m</option>
                      <option>100m</option>
                      <option>125m</option>
                      <option>150m</option>
                      <option>200m</option>
                      <option>250m</option>
                      <option>300m</option>
                      <option>350m</option>
                      <option>400m</option>
                      <option>500m</option>
                      <option>600m</option>
                      <option>700m</option>
                      <option>800m</option>
                      <option>900m</option>
                      <option>1000m</option>
                      <option>1500m</option>
                    </select>
                  </div>
                </div>

              </td>
              <td><input  type="text" class="form-control" id="number"></td>
              <td>                    
                <select class="form-control" id="sel1">
                  <option>50%</option>
                  <option>60%</option>
                  <option>65%</option>
                  <option>70%</option>
                  <option>80%</option>
                  <option>85%</option>
                  <option>90%</option>
                  <option>100%</option>
                </select>
              </td>
            </tr>
            <tr>
              <th>Braços</th>
              <td>
                <div class="centralizar">
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class=" row  col-md-4 ">
                    <select class="form-control" id="sel1">
                      <option>25m</option>
                      <option>50m</option>
                      <option>75m</option>
                      <option>100m</option>
                      <option>125m</option>
                      <option>150m</option>
                      <option>200m</option>
                      <option>250m</option>
                      <option>300m</option>
                      <option>350m</option>
                      <option>400m</option>
                      <option>500m</option>
                      <option>600m</option>
                      <option>700m</option>
                      <option>800m</option>
                      <option>900m</option>
                      <option>1000m</option>
                      <option>1500m</option>
                    </select>
                  </div>
                </div>

              </td>
              <td><input  type="text" class="form-control" id="number"></td>
              <td>                    
                <select class="form-control" id="sel1">
                  <option>50%</option>
                  <option>60%</option>
                  <option>65%</option>
                  <option>70%</option>
                  <option>80%</option>
                  <option>85%</option>
                  <option>90%</option>
                  <option>100%</option>
                </select>
              </td>
            </tr>
            <tr>
              <th>Resistência</th>
              <td>
                <div class="centralizar">
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class=" row  col-md-4 ">
                    <select class="form-control" id="sel1">
                      <option>25m</option>
                      <option>50m</option>
                      <option>75m</option>
                      <option>100m</option>
                      <option>125m</option>
                      <option>150m</option>
                      <option>200m</option>
                      <option>250m</option>
                      <option>300m</option>
                      <option>350m</option>
                      <option>400m</option>
                      <option>500m</option>
                      <option>600m</option>
                      <option>700m</option>
                      <option>800m</option>
                      <option>900m</option>
                      <option>1000m</option>
                      <option>1500m</option>
                    </select>
                  </div>
                </div>

              </td>
              <td><input  type="text" class="form-control" id="number"></td>
              <td>                    
                <select class="form-control" id="sel1">
                  <option>50%</option>
                  <option>60%</option>
                  <option>65%</option>
                  <option>70%</option>
                  <option>80%</option>
                  <option>85%</option>
                  <option>90%</option>
                  <option>100%</option>
                </select>
              </td>
            </tr>
            <tr>
              <th>Pernas</th>
              <td>
                <div class="centralizar">
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class=" row  col-md-4 ">
                    <select class="form-control" id="sel1">
                      <option>25m</option>
                      <option>50m</option>
                      <option>75m</option>
                      <option>100m</option>
                      <option>125m</option>
                      <option>150m</option>
                      <option>200m</option>
                      <option>250m</option>
                      <option>300m</option>
                      <option>350m</option>
                      <option>400m</option>
                      <option>500m</option>
                      <option>600m</option>
                      <option>700m</option>
                      <option>800m</option>
                      <option>900m</option>
                      <option>1000m</option>
                      <option>1500m</option>
                    </select>
                  </div>
                </div>

              </td>
              <td><input  type="text" class="form-control" id="number"></td>
              <td>                    
                <select class="form-control" id="sel1">
                  <option>50%</option>
                  <option>60%</option>
                  <option>65%</option>
                  <option>70%</option>
                  <option>80%</option>
                  <option>85%</option>
                  <option>90%</option>
                  <option>100%</option>
                </select>
              </td>
            </tr>
            <tr>
              <th>Educativo</th>
              <td>
                <div class="centralizar">
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class=" row  col-md-4 ">
                    <select class="form-control" id="sel1">
                      <option>25m</option>
                      <option>50m</option>
                      <option>75m</option>
                      <option>100m</option>
                      <option>125m</option>
                      <option>150m</option>
                      <option>200m</option>
                      <option>250m</option>
                      <option>300m</option>
                      <option>350m</option>
                      <option>400m</option>
                      <option>500m</option>
                      <option>600m</option>
                      <option>700m</option>
                      <option>800m</option>
                      <option>900m</option>
                      <option>1000m</option>
                      <option>1500m</option>
                    </select>
                  </div>
                </div>

              </td>
              <td><input  type="text" class="form-control" id="number"></td>
              <td>                    
                <select class="form-control" id="sel1">
                  <option>50%</option>
                  <option>60%</option>
                  <option>65%</option>
                  <option>70%</option>
                  <option>80%</option>
                  <option>85%</option>
                  <option>90%</option>
                  <option>100%</option>
                </select>
              </td>
            </tr>
            <tr>
              <th>Progressivo</th>
              <td>
                <div class="centralizar">
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class=" row  col-md-4 ">
                    <select class="form-control" id="sel1">
                      <option>25m</option>
                      <option>50m</option>
                      <option>75m</option>
                      <option>100m</option>
                      <option>125m</option>
                      <option>150m</option>
                      <option>200m</option>
                      <option>250m</option>
                      <option>300m</option>
                      <option>350m</option>
                      <option>400m</option>
                      <option>500m</option>
                      <option>600m</option>
                      <option>700m</option>
                      <option>800m</option>
                      <option>900m</option>
                      <option>1000m</option>
                      <option>1500m</option>
                    </select>
                  </div>
                </div>

              </td>
              <td><input  type="text" class="form-control" id="number"></td>
              <td>                    
                <select class="form-control" id="sel1">
                  <option>50%</option>
                  <option>60%</option>
                  <option>65%</option>
                  <option>70%</option>
                  <option>80%</option>
                  <option>85%</option>
                  <option>90%</option>
                  <option>100%</option>
                </select>
              </td>
            </tr>
            <tr>
              <th>Regenerativo</th>
              <td>
                <div class="centralizar">
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class=" row  col-md-4 ">
                    <select class="form-control" id="sel1">
                      <option>25m</option>
                      <option>50m</option>
                      <option>75m</option>
                      <option>100m</option>
                      <option>125m</option>
                      <option>150m</option>
                      <option>200m</option>
                      <option>250m</option>
                      <option>300m</option>
                      <option>350m</option>
                      <option>400m</option>
                      <option>500m</option>
                      <option>600m</option>
                      <option>700m</option>
                      <option>800m</option>
                      <option>900m</option>
                      <option>1000m</option>
                      <option>1500m</option>
                    </select>
                  </div>
                </div>

              </td>
              <td><input  type="text" class="form-control" id="number"></td>
              <td>                    
                <select class="form-control" id="sel1">
                  <option>50%</option>
                  <option>60%</option>
                  <option>65%</option>
                  <option>70%</option>
                  <option>80%</option>
                  <option>85%</option>
                  <option>90%</option>
                  <option>100%</option>
                </select>
              </td>
            </tr>
            <div class="row">
            <tr>
                <td colspan="4">
                    <div class="centralizar">
                        <input type="text" class="form-control" id="seuID">
                    </div>
                </td>
            </tr>
            </div>
          </tbody>
        </table>
      </div>

      <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script>
      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script>
</body>

Espero ter ajudado :D

2
  • Ficou exatamente como queria, muito obrigado pela ajuda
    – user73316
    18/11/2017 às 17:39
  • De nada. Bons estudos! 18/11/2017 às 17:39

Você deve fazer log-in para responder a esta pergunta.