html - 表格行和单元格损坏

标签 html css twitter-bootstrap

我有以下样式和 HTML,但当它显示时,表格似乎已损坏(所有表格行和单元格都已损坏)。我不确定为什么;我该如何解决?

tbody 需要有这个尺寸:height: calc(100vh - 130px);

红线定义了表格的大小。

编辑:我的 tbody 需要滚动并且 thead 需要修复。

jsfiddle:https://jsfiddle.net/zuxq2gr0/11/

.col-lg-12 {
  border: 1px solid red;
}

tbody {
  display: block;
  overflow-y: scroll;
  height: calc(100vh - 130px);
}

tbody > tr {
  display: table;
  width: 100%;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

<div class="col-lg-8 ">
  <div class="col-lg-12">
    <table class="table table-striped" aurelia-table="">
      <thead>
        <tr>
          <th>test</th>
          <th>test</th>
          <th>test</th>
          <th>test</th>
          <th>test</th>
        </tr>
      </thead>
      <tbody>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
      </tbody>
    </table>
    <!--  textarea -->
    <div class="form-group">
      <label class="col-md-12 control-label" for="textarea"></label>
      <div class="row">
        <div class="col-md-12">
          <compose view="./-box.html"></compose>
        </div>
      </div>
    </div>
  </div>
</div>

最佳答案

您需要按照以下代码删除一些样式:

table {
    width: 50%;
}

thead, tbody, tr, td, th {
    display: block;
}

thead th {
    height: 30px;
}

tbody {
    overflow-y: auto;
    height: calc(100vh - 130px);
}

tbody td, thead th {
    float: left;
    width: 20%;
}

tr:after {
    clear: both;
    content: ' ';
    display: block;
    visibility: hidden;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

<div class="col-lg-8 ">
  <div class="col-lg-12">
    <table class="table table-striped" aurelia-table="">
      <thead>
        <tr>
          <th>test</th>
          <th>test</th>
          <th>test</th>
          <th>test</th>
          <th>test</th>
        </tr>
      </thead>
      <tbody>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
        <tr class="">
          <td>test</td>
          <td>test</td>
          <td>test</td>
          <td>
            <div class="form-group">
              <select id="selectbasic" name="selectbasic" class="form-control col-lg-6 col-md-6 col-sm-6">
                <option value="" selected=""></option>
                <option value="-action"> Action</option>
              </select>
            </div>
          </td>
          <td>
            <i class="fa fa-minus" aria-hidden="true" click.delegate=""></i>
          </td>
        </tr>
      </tbody>
    </table>
    <!--  textarea -->
    <div class="form-group">
      <label class="col-md-12 control-label" for="textarea"></label>
      <div class="row">
        <div class="col-md-12">
          <compose view="./-box.html"></compose>
        </div>
      </div>
    </div>
  </div>
</div>

关于html - 表格行和单元格损坏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44407558/

相关文章:

html - css 代码桌面 View 和移动 View 不起作用

jquery - 显示没有断断续续的线性背景图像动画

javascript - Bootstrap - 在模态后面编辑 TextArea

HTML 在方形网格图片中指定分隔线间隙测量

html - 如何在 Bootstrap 中添加汉堡菜单

javascript - 向表中添加一行

javascript - 占位符值在 IE8 中不起作用

javascript - 显示和隐藏具有多个类名的 div jquery 复选框

javascript - 使用 Javascript 在某些 HTML 页面上添加侧边栏和更改填充

html - CSS 不匹配的宽度