[html] How to align td elements in center

I have created a simple table and want to align the td elements in center but align:center in css doesn't seem to work

.cTable td{
align:center;
}

<table border='1' id='mytable' class="cTable">
<tbody>
<tr><th>Claim ID</th><th>Status</th></tr> 
<tr><td align="center">22</td><td>333</td></tr>    
<tr><td>22</td><td>333</td></tr>
<tr><td>22</td><td>333</td></tr>
</tbody>
</table> 

This question is related to html css

The answer is


Give a style inside the td element or in your scss file, like this:

vertical-align: 
    middle;

margin:auto; text-align, if this won't work - try adding display:block; and set there width:200px; (in case your TD is too small).


I personally didn't find any of these answers helpful. What worked in my case was giving the element float:none and position:relative. After that the element centered itself in the <td>.


The best way to center content in a table (for example <video> or <img>) is to do the following:

_x000D_
_x000D_
<table width="100%" border="0" cellspacing="0" cellpadding="100%">
<tr>
<td>Video Tag 1 Here</td>
<td>Video Tag 2 Here</td>
</tr>
</table>
_x000D_
_x000D_
_x000D_


What worked for me is the following (in view of the confusion in other answers):

<td style="text-align:center;">
    <input type="radio" name="ageneral" value="male">
</td>

The proposed solution (text-align) works but must be used in a style attribute.