user1470240
user1470240

Reputation: 716

HTML: Place table right aligned in other table cell

I want a table inside of a td of another table to be aligned at the right side.

<table style="width: 100%;">
  <tr>
    <td style="text-align:right;">
      <table style="width: 200px; table-layout: fixed; background-color:blue">
        <tr>
          <td>
            <input style="width:100%" type="button" value="OK" />
          </td>
          <td>
            <input style="width:100%" type="button" value="Abbrechen" />
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>

As you can see, the inner table is shown at the left side. How to accomplish?

Upvotes: 0

Views: 42

Answers (1)

Johannes
Johannes

Reputation: 67738

Just add display: inline-table; to the inner table. Otherwise the text-align parameter won't apply, since it only applies to inline elements.

<table style="width: 100%">
  <tr>
    <td style="text-align:right;">
      <table style="width: 200px; table-layout: fixed; background-color:blue; display: inline-table;">
        <tr>
          <td>
            <input style="width:100%" type="button" value="OK" />
          </td>
          <td>
            <input style="width:100%" type="button" value="Abbrechen" />
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>

Upvotes: 1

Related Questions