Как выровнять по центру дочернюю таблицу HTML внутри родительской таблицы с помощью CSS

Question

У меня есть следующий формат таблицы HTML:

<table style="width: 100%;">
 <tr>
  <td>
   //How to center this table within the parent-table cell?
   <table style="width: 760px;">
    <tr>
     <td>
     </td>
    </tr>
   </table>
  </td>
 </tr>
</table>

Поскольку HTML5 не поддерживает 'align = center' для таблиц, я пытаюсь понять, как имитировать 'align = center' в CSS для вложенной таблицы в моем примере выше.

Я пытался возиться с атрибутом CSS margin, но безрезультатно.

Как центрировать подстол в приведенном выше примере?

Answer 1

table {border:solid 1px #0f0}
table table {border:solid 1px #f00;margin: 0 auto}

<table style="width: 100%;">
 <tr>
  <td>
   //How to center this table within the parent-table cell?
   <table style="width: 760px;">
    <tr>
     <td>
         Center This Table Dawg
     </td>
    </tr>
   </table>
  </td>
 </tr>
</table>

margin:0 auto; работал в этом примере, тестировался / работал в IE 7-9, FF 4, Chrome 11

Answer 2

<table style="width: 100%;">
 <tr>
  <td>
    <table style="width: 760px; margin: auto;">
     <tr>
      <td>
      ss
      </td>
     </tr>
    </table>
   </td>
  </tr>
 </table>