How to center align all cells of html table at once?

I am working on Time tabling software which generate time table in HTML format. When I open output file from directory, all the cell entries are center aligned, but when I send this file over email the cell entries becomes left aligned. Secondly, how I can increase font size of the title of table? The Html code is as follow:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en-US" xml:lang="en-US">
  <head>
    <title>Punjabi University, Patiala</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link rel="stylesheet" media="all" href="stylesheet.css" type="text/css" />
  </head>

  <body id="top">
    <table id="table" border="1">
      <caption>Punjabi University, Patiala</caption>
      <thead>
        <tr><td rowspan="2"></td><th colspan="3">Monday</th></tr>
        <tr>
          <!-- span -->
          <th class="xAxis">08:00</th>
          <th class="xAxis">09:00</th>
          <th class="xAxis">10:00</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <th class="yAxis">BS I</th>
          <td>Chemistry<br />T13<br /></td>
          <td>Mathematics<br />T01<br /></td>
          <td>Physics<br />T21<br /></td>
        </tr>
        <tr>
          <th class="yAxis">BS II</th>
          <td>Physics<br />T22<br /></td>
          <td>Mathematics<br />T02<br /></td>
          <td>Chemistry<br />T12<br /></td>
        </tr>
        <tr>
          <th class="yAxis">BS III</th>
          <td>Chemistry<br />T11<br /></td>
          <td>Physics<br />T23<br /></td>
          <td>Mathematics<br />T03<br /></td>
        </tr>
        <tr class="foot"><td></td><td colspan="3">Timetable generated with FET 6.9.2 on 8/1/23 7:19 AM</td></tr>
      </tbody>
    </table>

    <p class="back"><a href="#top">back to the top</a></p>

  </body>
</html>

Solution

You can create a CSS class for this.

#cssTable tbody tr td 
{
    text-align: center; 
    vertical-align: middle;
}

And assign this id in you table tag

<table id="cssTable" border="1">

To increase the font size, you can use style property font-size. For ex: style="font-size:40px" I have included this in the code snipped below. I have applied font size as 40px, you can change it according to your needs.

You code is going to look like this:

<head>
    <title>Punjabi University, Patiala</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link rel="stylesheet" media="all" href="stylesheet.css" type="text/css" />
  </head>
  <Style>
  #cssTable tbody tr td 
{
    text-align: center; 
    vertical-align: middle;
}
</Style>

  <body id="top">
    <table id="cssTable" border="1">
      <caption style="font-size:40px">Punjabi University, Patiala</caption>
      <thead>
        <tr><td rowspan="2"></td><th colspan="3">Monday</th></tr>
        <tr>
          <!-- span -->
          <th class="xAxis">08:00</th>
          <th class="xAxis">09:00</th>
          <th class="xAxis">10:00</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <th class="yAxis" >BS I</th>
          <td>Chemistry<br />T13<br /></td>
          <td>Mathematics<br />T01<br /></td>
          <td>Physics<br />T21<br /></td>
        </tr>
        <tr>
          <th class="yAxis">BS II</th>
          <td>Physics<br />T22<br /></td>
          <td>Mathematics<br />T02<br /></td>
          <td>Chemistry<br />T12<br /></td>
        </tr>
        <tr>
          <th class="yAxis">BS III</th>
          <td>Chemistry<br />T11<br /></td>
          <td>Physics<br />T23<br /></td>
          <td>Mathematics<br />T03<br /></td>
        </tr>
        <tr class="foot"><td></td><td colspan="3">Timetable generated with FET 6.9.2 on 8/1/23 7:19 AM</td></tr>
      </tbody>
    </table>

    <p class="back"><a href="#top">back to the top</a></p>

  </body>
</html>