CODEWITHSUNDEEP
htmlcss
daninthemix
daninthemix

Reputation: 2570

Table inside another table squashed

Am having trouble nesting one table inside another:

Squashed table

I want the inner tables to span across the entire width of the outer table. Here is the generated HTML: 

    <table class="table table-bordered table-striped">

<tr><td align="center">4 laptops were not added because they lacked unique identifiers.</td></tr>  <tr><td align="center">2 laptops were not added because they already exist in the database: </td></tr><tr><td>
  <table><th>Hostname</th><th>Asset Tag</th><th>Serial</th>
      <tr>
      <td></td>
      <td></td>
      <td>4646466</td>
    </tr>
      <tr>
      <td></td>
      <td></td>
      <td>4646467</td>
    </tr>
    </table></td></tr>
  <tr><td align="center">2 laptops were added to the database: </td></tr><tr><td>
  <table><th>Hostname</th><th>Asset Tag</th><th>Serial</th>
      <tr>
      <td></td>
      <td></td>
      <td>4646468</td>
    </tr>
      <tr>
      <td></td>
      <td></td>
      <td>4646469</td>
    </tr>
    </table></td></tr>
</table>

Upvotes: 1

Views: 57

Answers (2)

n-dru
n-dru

Reputation: 9430

Just add width attribute

width = '100%'

to the inner table. It will make it spread all over the width of the containing cell.

DEMO

Upvotes: 1

Head In Cloud
Head In Cloud

Reputation: 2051

Have a look

   <table class="table table-bordered table-striped" border="1">

<tr><td align="center">4 laptops were not added because they lacked unique identifiers.</td></tr>  <tr><td align="center">2 laptops were not added because they already exist in the database: </td></tr><tr><td>
  <table  border="1" style="width:100%;"><th>Hostname</th><th>Asset Tag</th><th>Serial</th>
      <tr>
      <td></td>
      <td></td>
      <td>4646466</td>
    </tr>
      <tr>
      <td></td>
      <td></td>
      <td>4646467</td>
    </tr>
    </table></td></tr>
  <tr><td align="center">2 laptops were added to the database: </td></tr><tr><td>
  <table><th>Hostname</th><th>Asset Tag</th><th>Serial</th>
      <tr>
      <td></td>
      <td></td>
      <td>4646468</td>
    </tr>
      <tr>
      <td></td>
      <td></td>
      <td>4646469</td>
    </tr>
    </table></td></tr>
</table>

Upvotes: 1

Related Questions