Table

Styles defined in the table tag are applied inside the table’s elements. Defined width attributes in table is applied in the open xml document. No border attribute or a border="0" will hide the border on the word document.

Disclaimer: MacOS Pages globally respect the OpenXml specification, excepted for Table where it interprets badly. Column width, row and col span could appear messy.

Rowspan and columnspan are supported

<table width="50%" align="center" border="1">
    <tr>
        <td rowspan="2">Anime Studio</td>
        <td>Pixar</td>
    </tr>
    <tr>
        <td>Studio Ghibli</td>
    </tr>
</table>

<table width="100%" border="1">
    <tr style="font-weight: bold">
        <td>Studio</td>
        <td colspan="2">Animes</td>
    </tr>
    <tr>
        <td>Pixar</td>
        <td>The incredibles</td>
        <td>Ratatouille</td>
    </tr>
    <tr>
        <td>Studio Ghibli</td>
        <td>Grave of the Fireflies</td>
        <td>Spirited Away</td>
    </tr>
</table>

Vertical text is supported

<table width="50%" align="center" border="1">
    <tr>
        <td rowspan="2" style="**writing-mode: tb-lr;**">Anime Studio</td>
        <td>Pixar</td>
    </tr>
    <tr>
        <td>Studio Ghibli</td>
    </tr>
</table>

Nested table

<table width="100%" cellspacing="2" border="1">
<tr>
    <td><b>The containing table</b>
        <table width="60%" cellspacing="2" cellpadding="2" align="left" border="1">
            <tr>
                <td>A nested table</td>
            </tr>
        </table>
    </td>
</tr>
</table>

Complex - ColSpan and RowSpan on the same cell

<table border="1">
    <tr>
        <th>Cell 1</th>
        <th colspan="2" rowspan="2">Value 1</th>
    </tr>
    <tr>
        <td>Cell 1</td>
    </tr>
    <tr>
        <td>Cell 2</td>
        <td>Value 2</td>
        <td>Value 3</td>
    </tr>
</table>

Column Definition

col tag describing the styles of columns across the whole table. You may or may not place those tags inside a colgroup tag.

The attribute span is supported to copy the styles on the next columns.

<table width='100%'>
<col style='color:#000000;background-color:seashell'/>
<col style='text-align:center' span='2' />
<thead>
    <tr style='background-color:lightgray;font-weight:bold'>
        <th>Attendee</th><th>Present?</th><th>Diet</th>
    </tr>
<thead>
<tbody>
<tr>
    <td>Jane</td><td>Yes</td><td>Gluten free</td>
</tr>
<tr>
    <td>Rick</td><td>No</td><td></td>
</tr>
<tr>
    <td>Matt</td><td>Yes</td><td>Veggie</td>
</tr>
</tbody>
</table>

Disordered table sections

Table sections are always reordered such as header-body-footer.

<table>
    <tbody><tr><td>Body</td></tr><tbody>
    <thead><tr><td>Header</td></tr><thead>
    <tfoot><tr><td>Footer</td></tr><tfoot>
</table>