Дополнительный столбец в таблице начальной загрузки - PullRequest
Новая
       20

Дополнительный столбец в таблице начальной загрузки

1 голос
/ 01 мая 2019

Почему в таблице есть дополнительный столбец?table image

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

<div class="container-fluid">
  <center>
    <a href="./" class="btn btn-primary">
      <i class="far fa-hand-point-left"></i> Back
    </a>
    <br /><br />
    <table class="table table-striped table-hover table-bordered table-responsive">
      <thead>
        <tr>
          <th>Sr.</th>
          <th>Name</th>
          <th>Contact</th>
          <th>City</th>
          <th>Action</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td>1</td>
          <td>
            Name</td>
          <td>Email Id (Mobile Number)</td>
          <td>City</td>
          <td><button class="btn btn-large btn-primary" disabled>Waiting for Directory</button></td>
        </tr>

        <tr>
          <td>2</td>
          <td>
            Name</td>
          <td>Email Id (Mobile Number)</td>
          <td>City</td>
          <td><a href="?ua=trial" class="btn btn-large" style="background-color: red;color: white;">Block</a></td>
        </tr>

      </tbody>
    </table>

  </center>
</div>

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>

Почему в таблице есть дополнительный столбец? см. Изображение

Кроме того, почему на маленьком экране есть полоса прокрутки?(Он должен настраиваться на экране так, как я использую реагирующий на таблицу .)

Ответы [ 2 ]

1 голос
/ 01 мая 2019

добавить .table-responsive класс к родителю.не на столе 

<div class="table-responsive">
  <table class="table">
    ...
  </table>
</div>
0 голосов
/ 01 мая 2019

Удалить .table-responsive или добавить атрибут стиля в табличный тег display : table

...