Center-align a HTML table

30    Asked by GloriaHoll in Python , Asked on Jul 27, 2025

Want your HTML table to appear neatly centered on the page? Learn the different ways to horizontally center-align a table using simple HTML or CSS techniques for clean, professional-looking layouts.

Answered by Lucy Shortle

To center-align an HTML table, you have a couple of easy and effective options, depending on whether you prefer HTML or CSS. Centering a table can enhance the visual structure of your web page and make your content look more balanced.

 Method 1: Using HTML align Attribute (Not Recommended in HTML5)

Although this method works, it's outdated and not considered best practice:


 

 Note: This method is deprecated in HTML5, so it's better to use CSS.

 Method 2: Using CSS (Recommended)

This is the most modern and flexible way to center a table.

Option A: Using margin: auto


 

Option B: Using CSS Class


  .center-table {
    margin-left: auto;
    margin-right: auto;
  }


 

  •  Key Points:
  • Always prefer CSS for layout styling over HTML attributes.
  • margin: auto works only if the table has a defined width (explicitly or by content).
  • You can also use text-align: center; on a parent container and display: inline-table; on the table for alternate approaches.



Your Answer

Interviews

Parent Categories