Guilherme Freire
Guilherme Freire

Reputation: 372

how to remove this line on table

I need to remove a line between thead and tbody on this table using bootstrap3
I have tried with css but without success

I tried removing borders and collapsing of table but I get this

Error

<table class="table">
    <thead>
    <tr>
        <th>Atividade:</th>
        <th>Meta:</th>
        <th>Responsável</th>
        <th>Parceria:</th>
        <th></th>
    </tr>
</thead>
<tbody>
    <tr>
        <td>
            <input type="text" class="form-control" name="NomeAtividade[]" required="">
        </td>        
        <td>
           <input type="number" min="0" max="100" step="1" value="0"  class="form-control" id="MetaAtividade" name="MetaAtividade[]">
        </td>        
        <td>
            <input type="text" class="form-control" name="ResponsavelAtividade[]">
        </td>
        <td>
            <input type="text" class="form-control" name="ParceiroAtividade[]">
        </td>
        <td>
            <button type="button" class="btn btn-default addButton"><i class="glyphicon glyphicon-plus"></i></button>
        </td>

    </tr>
</tbody>

Upvotes: 1

Views: 1881

Answers (1)

dippas
dippas

Reputation: 60573

it is coming from the Bootstrap.css, you have to set border:0 in 2 elements, see snippet below,

Used !important only for demo

.table {
  background: darkgreen
}
.table > tbody > tr > td,
.table > thead > tr > th {
  border: 0 !important
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
<table class="table">
  <thead>
    <tr>
      <th>Atividade:</th>
      <th>Meta:</th>
      <th>Responsável</th>
      <th>Parceria:</th>
      <th></th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>
        <input type="text" class="form-control" name="NomeAtividade[]" required="">
      </td>
      <td>
        <input type="number" min="0" max="100" step="1" value="0" class="form-control" id="MetaAtividade" name="MetaAtividade[]">
      </td>
      <td>
        <input type="text" class="form-control" name="ResponsavelAtividade[]">
      </td>
      <td>
        <input type="text" class="form-control" name="ParceiroAtividade[]">
      </td>
      <td>
        <button type="button" class="btn btn-default addButton"><i class="glyphicon glyphicon-plus"></i>
        </button>
      </td>

    </tr>
  </tbody>

Upvotes: 2

Related Questions