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

Question

我有这个HTML代码：

unsnoc

我想仅以<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的其他子元素为中心。所以我尝试了下面的CSS：

td

但代码会影响其他元素td { text-align:center; } 。我尝试了代码：

<div>

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

Answer 1

设置固定的width，然后设置margin: auto，同时设置display: block。 text-align: center将使所有内容成为中心。

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

<强> jsFiddle

Answer 2

试试这个：

td {
 text-align:center; 
}

td div {
 text-align:left;
}

table {
 width: 100%;
}