, bir tuval öğesi ancak merkezi değil onun kardeşlerinin

Question

bu HTML kodunu vardır:

<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> 

Ben td sadece canvas değil diğer alt elemanları ortalamak istiyorum.

td { 
    text-align:center; 
} 

Ama kod diğer unsurları <div> etkiler: Ben css aşağıda çalıştı. Kodu denedim:

Yukarıdaki kod tuval öğemi ortalamıyor mu? Ne yapmalıyım?

Answer 1

Sabit bir width ve ardından margin: auto, ayrıca display: block'u ayarlayın. text-align: center tüm içeriği ortalayacaktır.

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

jsFiddle

Answer 2

bu deneyin:

td { 
text-align:center; 
} 

td div { 
text-align:left; 
} 

table { 
width: 100%; 
}