# Align Title of columns with data in the table

**URL:** <https://forum.inductiveautomation.com/t/align-title-of-columns-with-data-in-the-table/93170>\
**Category:** Ignition\
**Tags:** database, ignition81, perspective\
**Created:** [July 12, 2024, 10:16pm UTC](https://forum.inductiveautomation.com/t/align-title-of-columns-with-data-in-the-table/93170 "2024-07-12T22:16:25Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Ryan\_Crawford](https://avatars.discourse-cdn.com/v4/letter/r/a587f6/32.png) [@Ryan\_Crawford](https://forum.inductiveautomation.com/u/Ryan_Crawford)\
**Post date:** [July 12, 2024, 10:16pm UTC](https://forum.inductiveautomation.com/t/align-title-of-columns-with-data-in-the-table/93170/1 "2024-07-12T22:16:25Z")

</div>

Good Morning,

I am using Ingtion in perspective and I have a table that is getting information from a SQL query.

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/c/d/cdea12e70370580fd56daf6501784cb5e3a34bd9.png)

Current how can I align the title of the column with the data in the column?  
This is my cuurent settings:  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/f/e/fee2c88c8759f33846ae1725241d2f0d285a9769.png)

Thanks,

---

<div class="post-metadata">

**Author:** ![pascal.fragnoud](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pascal.fragnoud/32/24728_2.png) [@pascal.fragnoud](https://forum.inductiveautomation.com/u/pascal.fragnoud)\
**Post date:** [July 13, 2024, 10:12am UTC](https://forum.inductiveautomation.com/t/align-title-of-columns-with-data-in-the-table/93170/2 "2024-07-13T10:12:25Z")

</div>

You could change the alignment on the header of each column to match the alignment of the column itself.

For example, set `align` property of the `ID` header to "right".  
If header don't have an `align` property, you can add `text-align: right` in its styles.

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [July 13, 2024, 9:10pm UTC](https://forum.inductiveautomation.com/t/align-title-of-columns-with-data-in-the-table/93170/3 "2024-07-13T21:10:46Z")

</div>

Text columns should left-align.  
Numeric columns should right-align for ease of comparison and lining up units, tens, hundreds, etc.

Set  
`columns.n.justify : right` (where `n` is the column number)  
`columns.n.header.justify : right`

I recommend creating a style class, `paddingLR`, with 5px or so padding on the left and right. You can then apply this easily to each column to add a little air at each side.  
`columns.n.style.classes : paddingLR`  
`columns.n.header.style.classes : paddingLR`

You can now adjust this by tweaking the style and all columns and headers will update.