在表格单元格中,将画布元素居中,而不是其兄弟姐妹

Question

我有这个HTML代码:

<tbody>
     <tr>
         <td>
             <canvas class="myid_templates_editor_canvas"></canvas>
             <div>A lot of codes here</div>
             <div>A lot of codes here</div>
         </td>
     </tr>
<tbody>

我想只以中心canvas而不是其他子元素为中心td.所以我尝试了下面的CSS:

td {
    text-align:center;
}

但代码会影响其他元素<div>.我试过这段代码:

td > canvas {
    text-align:center;
}

上面的代码不是我的canvas元素的中心？我该怎么办？

Answer 1

设置固定width然后margin: auto,也display: block.text-align: center将使所有内容成为中心.

canvas.myid_templates_editor_canvas {
    width: 200px;
    margin: auto;
    display: block;
}

的jsfiddle