Is it possible to center and span the "MyTable" heading using both HTML (the center tag) and CSS? I've tried adjusting text-align, positioning, and more but haven't been able to achieve the desired result.
<!DOCTYPE html>
<html>
<head>
<style>
th {
border: 1px solid red;
text-align: center;
}
td {
border: 1px dashed black;
color: red;
}
table {
font-family: Calibri;
}
</style>
</head>
<body>
<table>
<tr><th>My Table</th></tr>
<tr><th>FName</th><th>LName</th><th>Age</th></tr>
<tr><td>Derp</td><td>Derpania</td><td>69</td></tr>
<tr><td>Buzz</td><td>Killington</td><td>42</td></tr>
</table>
</body>
</html>
Please provide solutions in both CSS and HTML if available.