Tables

Use tables to structure information into rows and columns for easy comparison. For example, to compare features in different editions of a product or to document the responsibilities of different roles.

To insert a table, use the <table> element, add rows using <tr>, and cells using <td>.

Header rows and columns

By default, Writerside renders tables with the first row as the header. Use the style attribute to change the table header.

style="header-row" is the default value, which renders the table with a header row at the top:

Column Name	Column Name	Column Name
Lorem ipsum dolor sit amet	Consectetur adipiscing elit	Mauris feugiat euismod sapien at iaculis

Set style="header-column" to render the table with the first column as the header:

Row Name	Lorem ipsum dolor sit amet	Consectetur adipiscing elit
Row Name	Mauris feugiat euismod sapien at iaculis	Sed vel turpis quam

Set style="both" to render both a header row and a header column:

	Column Name	Column Name
Row Name	Lorem ipsum dolor sit amet	Consectetur adipiscing elit
Row Name	Mauris feugiat euismod sapien at iaculis	Sed vel turpis quam

Set style="none" to render the table without headers:

Consectetur adipiscing elit.	Lorem ipsum dolor sit amet.
Mauris feugiat euismod sapien at iaculis	Sed vel turpis quam

Column width

By default, Writerside automatically adjusts row and column sizes according to the size of the content in a table.

            <table>
                <tr>
                    <td>Column</td>
                    <td>Wide column</td>
                    <td>Very wide column</td>
                </tr>
                <tr>
                    <td>one</td>
                    <td>two</td>
                    <td>three</td>
                </tr>
                <tr>
                    <td>one</td>
                    <td>two</td>
                    <td>three</td>
                </tr>
            </table>
        

As you change the width of the window, this table will always automatically adjust the first column to be the smallest and the third one to be the widest:

Column	Wide column	Very wide column
one	two	three
one	two	three

You can use the width attribute in the <td> element to set the width of a column in pixels:

            <table>
                <tr>
                    <td width="300">Column</td>
                    <td>Wide column</td>
                    <td>Very wide column</td>
                </tr>
                <tr>
                    <td>one</td>
                    <td>two</td>
                    <td>three</td>
                </tr>
                <tr>
                    <td>one</td>
                    <td>two</td>
                    <td>three</td>
                </tr>
            </table>
        

Other columns will still be automatically adjusted according to their content:

Column	Wide column	Very wide column
one	two	three
one	two	three

Use the column-width attribute in the <table> element to disable auto-adjustment of column widths:

            <table column-width="fixed">
                <tr>
                    <td>Column</td>
                    <td>Wide column</td>
                    <td>Very wide column</td>
                </tr>
                <tr>
                    <td>one</td>
                    <td>two</td>
                    <td>three</td>
                </tr>
                <tr>
                    <td>one</td>
                    <td>two</td>
                    <td>three</td>
                </tr>
            </table>
        

Setting column-width="fixed" forces all column widths to be equal:

Column	Wide column	Very wide column
one	two	three
one	two	three

You can still set the width of specific columns:

            <table column-width="fixed">
                <tr>
                    <td width="300">Column</td>
                    <td>Wide column</td>
                    <td>Very wide column</td>
                </tr>
                <tr>
                    <td>one</td>
                    <td>two</td>
                    <td>three</td>
                </tr>
                <tr>
                    <td>one</td>
                    <td>two</td>
                    <td>three</td>
                </tr>
            </table>
        

However, in a fixed-width table, other columns will take equal portions of the remaining width:

Column	Wide column	Very wide column
one	two	three
one	two	three

Markdown tables

For simple tables in a Markdown file, use hyphens --- to separate the header row, and pipes | to separate each column.

            | Foo    | Bar    | Baz      |
            |--------|--------|----------|
            | One    | Two    | Three    |
            | Higher | Faster | Stronger |
        

Alternatively, press Alt+Insert to open the Insert menu, and then select Table to generate a Markdown table of any size.

Markdown tables have certain limitations. For example, they must always have a header row, you cannot break lines in cells, you cannot span a cell across multiple rows or columns. If you need a more complex table, use the <table> element.

Convert Markdown table to semantic markup

With the caret inside the table, press Alt+Enter and select Convert Markdown table to XML format.

Last modified: 07 August 2024