Table styles

Never use tables to lay out a page.

They should only be used in very specific situations, like when you need to display data in tabular format:

Fruit Colour
apple red
banana yellow
orange orange

 

Try not to specify widths in pixels

In the Table Properties dialog, try to not specify the Width field in pixels – especially for wide tables. Small mobile viewports are only 300 pixels wide, and if you se the width of the table to more than that the layout will appear “broken”. Instead, either clear the Width field or type in a percentage e.g. 100%.

Headers

To create column headers like on the example above, set the Cell Type of those cells to Header.

Alternate row colours 

It’s easy to create alernate row colours for tables with many rows; our standard style sheet has a style for that. To apply it edit the Table Properties, select the Advanced tab and type in altrows into the Stylesheet Classes field. The example below illustrates it:

Fruit Colour
apple red
banana yellow
orange orange
kiwi green
grape purple

 

Top of page