projectdoc Toolbox

The Display Table Macro provides a quick fix feature to control the width of the table columns.

Parent
Audience
Level of Experience
Expected Duration
5 min
Type

Especially if there are multiple tables on a page there is the need to control the widths of the table columns. The Display Table Macro supports to apply a CSS class and to control the widths of the columns explicitly.

The Problem

Multiple tables on page with similar content, but individual column width look a bit fuzzy:

If you use the Display Table Macro for rendering, you may specify the column widths for each table explicitly.

The Solution

The solution is quite simple. Use the property Table Render Mode of the Display Table Macro to specify the Cascading Style Sheets (CSS) class to use and list the widths of the columns.

table=projectdoc-alternating[columns=220px,*,220px]


Since 5

 

Since version 5 of the projectdoc Toolbox besides commas also semicolons are allowed to separate the column width.

table=projectdoc-alternating[columns=220px;*;220px]

For this example we also choose the CSS class projectdoc-alternating to render the background of odd and even table rows differently.

The result is like this:

The option for specifying the width of the columns explicitly is a quick way to get the desired results for a single page. If you need to control tables on multiple pages you should consider to define a CSS class for these kind of tables.

Room for Enhancement

There are a few minor obstacles that may should be improved:

  • Editing the parameter value in the text field of the macro editor is a little cumbersome.
  • Once there is a new column added, the width has to be added manually.
  • There is no way to specify the widths for all tables on a page. Therefore you need to paste the same configuration line as the value for the Table Render Mode of each table. As a workaround you may specify a CSS class to be reused even on other pages.