Jason Martinez
Jason Martinez

Reputation: 138

How remove border to cell in a table?

I'm using Bootstrap 3 and I want to remove border of cell:

<td colspan="4"></td>

This is the current table:

<table class="table table-bordered table-hover">
<thead>
  <tr>
    <th>N°</th>
    <th>Fecha salida</th>
    <th>Fecha regreso</th>
    <th>Ciudad</th>
    <th>País</th>
    <th>Días</th>
  </tr>
</thead>
<tbody>
  <tr class="info">
    <td>1</td>
    <td>03/02/2015</td>
    <td>05/02/2015</td>
    <td>Ciudad de Panamá</td>
    <td>Panamá</td>
    <td>3</td>
  </tr>
  <tr>
    <td>2</td>
    <td>05/12/2014</td>
    <td>05/12/2014</td>
    <td>New York</td>
    <td>EE.UU</td>
    <td>1</td>
  </tr>
  <tr class="bold">
    <td colspan="4"></td>
    <td align="right">Días fuera</td>
    <td>4</td>
  </tr>
</tbody>
</table>

Current View: enter image description here

Desired View: enter image description here

Upvotes: 1

Views: 107

Answers (2)

Mert S. Kaplan
Mert S. Kaplan

Reputation: 1126

Use this CSS

#hiddenborder{
    border-bottom: hidden;
    border-left: hidden;
}

Upvotes: 1

Dan
Dan

Reputation: 448

One way to do it is to set the border-bottom css property to hidden for <td colspan="4"></td>.

<td colspan="4" style="border-bottom: hidden;"></td>.

...or include the css in your 'bootstrap overriding stylesheet' (if you have one).

Fiddle

Upvotes: 2

Related Questions