Div |
---|
|
On this page Table of Contents |
---|
maxLevel | 1 |
---|
exclude | On this page |
---|
type | flat |
---|
separator | pipe |
---|
|
|
Overview
This page outlines an example of how to style table columns using the CSV macro, Table Plus macro, Attachment Table macro, or JSON Table Macro, which are part of the Advanced Tables for Confluence add-on.
Since release 5.4, there are more capabilities to control table display characteristics. Specifically, setting the table class (default is confluenceTable), table style, and row styles. See Common Table Capabilities for more details.
Since release 6.4, there is now another option for column styling with the columnStyles parameter. It defines column level CSS at the HTML column level where as the columnAttributes parameter works at the element level and provides more than CSS styling capabilities. columnStyles can be easier to use and is recommended for most use cases. However, it does not cover every use case that is available with the columnAttributes parameter.
Macro Browser Input
Select this Macro
Macro Name | Any of the following: - CSV (Comma Separated Values)
- Table Plus
- Attachment Table
|
Macro Syntax | Any of the following: - {csv}
- {table-plus}
- {attachment-table}
|
Define these Parameters/Values
Each column can be styled by setting the style attribute. For example setting the columnAttributes parameter to:
...
No Format |
---|
style="border:0;background:lightgrey;",style="border:0;background:lightyellow;",style="border:0;background:lightgreen;" |
Screenshot
Image Removed
Wiki Markup Input
For a table built using the CSV macro:
Code Block |
---|
language | text |
---|
linenumbers | true |
---|
|
{csv:columnAttributes=style="border:0;background:lightgrey;",style="border:0;background:lightyellow;",style="border:0;background:lightgreen;"}
Heading 1,Heading 2,Heading 3
A1,A2,A3
B1,B2,B3
{csv} |
Example Result
...
columnAttributes | style="border:0;background:lightgrey;",style="border:0;background:lightyellow;",style="border:0;background:lightgreen;" |
---|
Heading 1 | Heading 2 | Heading 3 |
---|
A1 | A2 | A3 |
B1 | B2 | B3 |
...
Div |
---|
style | padding: 30px 15px 25px 25px; margin-bottom: 25px !important; |
---|
class | montage |
---|
|
Styling guideThe table styling shown in this example utilizes the common table capabilities of several Bob Swift Atlassian add-ons including TBL, SQL, and others. For creative inspiration when styling your own Confluence Tables (including live examples) visit our Styling Guide for Tables. |
Style |
---|
.montage img {padding-bottom: 25px !important;} |
Other Examples
Visit our full list of product examples for additional inspiration!
Image Removed
Include Page |
---|
| SUPPORT:Style table columns - 8.x |
---|
| SUPPORT:Style table columns - 8.x |
---|
|