How to change the styling (text align, padding, font colors, etc) of specific columns

Changing the styling of a specific column is a two step process:
  1. Add a new rule that will apply a CSS class to the desired table elements (e.g. columns)
  2. In the companion CSS file define the CSS class.

Let's say that you want to set the text alignment of the last 3 columns to right , instead of the default left alignment. You add a new rule that will add the CSS class td_rightcolumns to the last 3 columns, as shown below:

The range L3-L1 means the last 3 columns (L1 is the last element, L2 is the second to last element, L3 is the third to last element and so on). Since the selected element is "Column", the CSS class td_rightcolumns will be applied to the last three elements.

So far we have added the CSS class to the last three columns, but we haven't specified the styling attributes of this class. In order to do so, we edit the companion CSS file and we add the following CSS definitions at the end of the file:

td.td_rightcolumns { text-align: right;}


Of course, we could have added more attributes, such as:
td.td_rightcolumns { text-align: right; font-style:bold; color: #FF0033;}