Customize Table in Bootstrap

Question

I am creating an ecommerce website using the current Bootstrap version. On the admin panel I am trying to show all the product infos within a table in such a way that it looks like this :

+______+_____________+_____+_______+_____+
| name | description | qty | price | sku |
+______+_____________+_____+_______+_____+
|  P1  | Description | 10  |  200  | 2ds |
+______+_____________+_____+_______+____ +
| Image 1 , Image 2 , Image 3, ......    |
+______+_____________+_____+_______+____ +
|  P2  | Description | 14  |  500  | 3ds |
+______+_____________+_____+_______+____ +
| Image 1 , Image 2 , Image 3, ......    |
+______+_____________+_____+_______+____ +
|  P3  | Description | 45  |  234  | 4xs |
+______+_____________+_____+_______+____ +
| Image 1 , Image 2 , Image 3, ......    |
+______+_____________+_____+_______+____ +        

And so on. Hope I can make you understand what I am trying to do here. After every product row comes the product images.. then again another product row and its corresponding images and so on....

What I have tried :

<table class="table table-striped text-center">
                            <thead>
                                <tr>
                                  <th>Name</th>
                                  <th>Category</th>
                                  <th>Description</th>
                                  <th>Stock Qty</th>
                                  <th>Shown Qty</th>
                                  <th>Sale Price</th>
                                  <th>Original Price</th>
                                  <th>SKU</th>
                                  <th>Image</th>
                                  <th>Action</th>
                                  </tr>
                            </thead>
                           <tbody>
                              <tr>
                              <td>Some Product</td>
                              <td>T Shirt</td>
                              <td>Description</td>
                              <td>24</td>
                              <td>500</td>
                              <td>BKSTU56V57</td>
                              </tr>
                              <tr><img src=".." /><img src="...."></tr> 
                          </tbody>
                          </table>

And it's not working. taking the images to the top even before the <th>

Answer 1

You're missing the <td> element. Try this with column span:

<tr><td colspan="6"><img src=".." /><img src="...."></td></tr>