Mystical
Mystical

Reputation: 2783

Bootstrap table make one column the full width of the row

Let's say I had the following table in bootstrap:

<table class="table table-bordered">
  <tr><th>Title</th></tr> 
  <tr>
    <th>Heading</th>
    <td>Value</td>
  </tr> 
</table>

I would like to make sure the Title column its full width, meaning the size of the Heading and Value columns combined, or in other words, the size of the whole row.

I've tried this but without any luck:

<tr><th style="width: 100%">Title</th></tr>

How can make sure the Title isn't the size of an ordinary column, but the size of the whole row instead?

Upvotes: 0

Views: 1495

Answers (1)

Claire
Claire

Reputation: 3184

Just use the colspan attribute, like so:

<table class="table table-bordered">
  <tr>
     <th colspan=“2”>Title</th>
  </tr>
  <tr>
    <th>Heading</th>
    <td>Value</td>
  </tr> 
</table>

Upvotes: 3

Related Questions