How to align table content HTML table

  • A+

I am working in HTML for a project. Need help in aligning two tables. Table One contains table head and table two contains table body. How to align both the table synchronously.

Here is the code:

<body>  <h2>HTML Table</h2>  <table> <thead>   <tr>     <th>Company</th>     <th>Contact</th>     <th>Country</th>   </tr>   </thead>   </table>   <table>   <tbody>   <tr>     <td>Alfreds Futterkiste</td>     <td>Maria Anders</td>     <td>Germany</td>   </tr>   </tbody> </table>  </body> 

Here is the Demo


You can try this code 
<!DOCTYPE html>     <html>     <head>     <style>     table, th, td {       border: 1px solid black;       border-collapse:collapse;       text-align:center;     }     </style>     </head>     <body>      <h2>HTML Table</h2>       <table style="width:100%">      <thead>       <tr>         <th>COMPANY</th>         <th>CONTACT</th>          <th>COUNTRY</th>       </tr>       </thead> <tbody>       <tr>         <td>alfreds</td>         <td>Maria Anders</td>         <td>Germany</td>       </tr>         <tr>         <td>alfreds</td>         <td>Maria Anders</td>         <td>Germany</td>       </tr>      </tbody>     </table>      </body>     </html>


:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: