HTML table provides the ability to show text, data, and other elements. While using tables we may want to center the table or table contents to the center. Centering the table and its contents will be centered and look pretty.
Center Table with margin-left and margin-right Attribute
The first way to make an HTML table center is by using margin-left
and margin-right
CSS attributes. We can set these attributes as auto
or the same value in order to make the table center.
<html> <head> <style> table, th, td { border: 1px solid black; } </style> </head> <body> <table style="margin-left:auto; margin-right:auto;"> <tr> <th>Name</th> <th>Surname</th> </tr> <tr> <td>İsmail</td> <td>Baydan</td> </tr> <tr> <td>Ahmet Ali</td> <td>Baydan</td> </tr> <tr> <td>Elif Ecrin</td> <td>Baydan</td> </tr> </table> </body> </html>

Center Table Content with align Attribute
The table HTML element provides an align
attribute which will align the table. The align attribute can get right
, left
and center
values. In the following example, we will set the align
attribute to the center
.
<html> <head> <style> table, th, td { border: 1px solid black; } </style> </head> <body> <table align="center"> <tr> <th>Name</th> <th>Surname</th> </tr> <tr> <td>İsmail</td> <td>Baydan</td> </tr> <tr> <td>Ahmet Ali</td> <td>Baydan</td> </tr> <tr> <td>Elif Ecrin</td> <td>Baydan</td> </tr> </table> </body> </html>
