Write the Html to Produce the below code, attach a screenshot of the results as part of the answer. The table should be aligned to the centre of the page with a proportional width of 70% and a proportional height of 40%

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <style>

    #table {
      position: absolute;
      top: 25%;
      left: 25%;
    }  
  
    table {
        width: 70%;
        height: 40%;
        border-style: solid;
        border-color: black;
        border-collapse: collapse;
    }

    td {
        width: 70%;
        height: 40%;
        border-style: solid;
        border-color: black;
        border-collapse: collapse;
        padding: 10px;
    }

    .titles {
        font-weight: bold;
    }

    .test {
        text-align: center;
    }

    .col1{
      width: 25%;
    }
    
    .col2 {
      width: 40%;
    } 
    
    .col3 {
      width: 20%;
    }  
</style>
<title>Table</title>

</head> <body> <div id="table"> <table id="row11col5">  <tr> <th id="tcb" rowspan="11" colspan="4">TCB</th> <td class="titles col1">Order no:</td> <td colspan="3">#ABC001</td> </tr>  <tr> <td class="titles col1">Order Date:</td> <td colspan="3">23-Mar-2016</td> </tr>  <tr> <td class="titles test" colspan="4">Customer</td> </tr>  <tr> <td class="titles col1">Name:</td> <td colspan="3">John Papas</td> </tr>  <tr> <td class="titles col1">Address:</td> <td colspan="3">Independence Day 5th str, 11511</td> </tr>  <tr> <td class="titles test" colspan="4">Order Details</td> </tr>  <tr> <td class="col1">1</td> <td class="col2">Of Mice and Men</td> <td class="col3">Book</td> <td>10.00€</td> </tr>  <tr> <td class="col1">2</td> <td class="col2">Les Miserables</td> <td class="col3">Book</td> <td>12.00€</td> </tr>  <tr> <td class="col1">3</td> <td class="col2">Game of Thrones-S01</td> <td class="col3">DVD</td> <td>50.00€</td> </tr>  <tr> <td class="col1">4</td> <td class="col2">Samsung Galaxy</td> <td class="col3">Mobile Phone</td> <td>200.00€</td> </tr>  <tr> <td style="text-align: right;" class="titles" colspan="3">Total:</td> <td>272.00€</td> </tr> </div> </body> </html> [table.png](https://static.onecompiler.com/images/questions/3z4ct2yen/table.png)

1 Answer