Hi! Does anyone know how to center a specific table column header? I don’t want to center every column header, just a specific one in a specific table. I tried using the following, which works sometimes, but it’s not working for me:
CSS:
#view_1 th.field_1 a.level {
justify-content: center;
}
Explanation:
To style anything, you need to find its CSS Selector. To find CSS Selectors, you can right-click on any element on the screen and click “Inspect”. Here’s an example of how that looks:
Here’s an explanation of how CSS Selectors work:
https://www.w3schools.com/cssref/css_selectors.asp
For example, to select all table headers, the selector is th
th {
}
To select table headers with a class of “field_29”, the selector is th.field_29
th.field_29 {
}
To further restrict this to a specific view ID, you can add another selector before it, like this:
#view_123 th.field_29 {
}
Your styles go inside the curly braces { }
Hope this helps
Thanks so much @KnackPros!! That worked great! Now the only issue is when I put a
between words in the header…that makes the word after the break not centered. Any tweak I need to make to the code? This is what I have so far:
/Center text/
#view_1195 th.field_860 a.level {
justify-content: center;
}
I just added “text-align: center;” to the code and it seems to be working with the line break…THANK YOU IAN!!
/Center text/
#view_1195 th.field_860 a.level {
justify-content: center;
text-align: center;
}