# Alarms Table HeadContainer color not updating

**URL:** <https://forum.inductiveautomation.com/t/alarms-table-headcontainer-color-not-updating/78712>\
**Category:** General Discussion\
**Tags:** perspective\
**Created:** [September 4, 2023, 7:48am UTC](https://forum.inductiveautomation.com/t/alarms-table-headcontainer-color-not-updating/78712 "2023-09-04T07:48:55Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Learner\_Ignition](https://avatars.discourse-cdn.com/v4/letter/l/b3f665/32.png) [@Learner\_Ignition](https://forum.inductiveautomation.com/u/Learner_Ignition)\
**Post date:** [September 4, 2023, 7:48am UTC](https://forum.inductiveautomation.com/t/alarms-table-headcontainer-color-not-updating/78712/1 "2023-09-04T07:48:55Z")

</div>

Hi,  
I had followed below topic for updating Alarm status table headcontainer color.

> [@Change Header Color for Alarm Status table in Perspective](https://forum.inductiveautomation.com/t/change-header-color-for-alarm-status-table-in-perspective/73511/5):
>
> Hi @Senthoor_Mani_M. under the Meta data of your alarm status object create a domId with the value of your choice [image] Under Styles/stylesheet.css enter the following code #alarmTable .ia\_table\_\_headContainer{ background-color:black; } Just change the #alarmTable with the domId value you use (always with an # first). Then save your project and the modification should be applied to all alarm status table with the same domId. Be aware that the advanced style sheet is availab…

> **Summary**
>
> {  
> "custom": {},  
> "params": {},  
> "props": {  
> "defaultSize": {  
> "height": 688,  
> "width": 1720  
> }  
> },  
> "root": {  
> "children": [  
> {  
> "children": [  
> {  
> "meta": {  
> "domId": "alarmTable",  
> "name": "AlarmStatusTable"  
> },  
> "props": {  
> "columns": {  
> "active": {  
> "activeTime": {  
> "width": 50  
> },  
> "displayPath": {  
> "enabled": false  
> },  
> "name": {  
> "width": 400  
> },  
> "priority": {  
> "enabled": false,  
> "width": 30  
> },  
> "source": {  
> "enabled": false  
> },  
> "state": {  
> "enabled": false  
> }  
> }  
> },  
> "columnsAssociated": {  
> "active": [  
> {  
> "enabled": true,  
> "field": "activeTime",  
> "order": 0,  
> "sort": "descending",  
> "strictWidth": false,  
> "width": 100  
> },  
> {  
> "enabled": true,  
> "field": "name",  
> "order": 0,  
> "sort": "none",  
> "strictWidth": false,  
> "width": 600  
> },  
> {  
> "enabled": true,  
> "field": "Priority",  
> "order": 0,  
> "sort": "none",  
> "strictWidth": false,  
> "width": 100  
> }  
> ]  
> },  
> "dateFormat": "YYYY-MM-DD HH:mm:ss",  
> "dragOrderable": false,  
> "enableDetails": false,  
> "enableShelve": false,  
> "enableUnshelve": false,  
> "filters": {  
> "active": {  
> "states": {  
> "clearUnacked": false  
> }  
> }  
> },  
> "rowStyles": {  
> "activeUnacked": {  
> "base": {  
> "fontWeight": "bold"  
> }  
> }  
> },  
> "selection": {  
> "active": {  
> "mode": "single"  
> },  
> "shelved": {  
> "mode": "single"  
> }  
> },  
> "toolbar": {  
> "enabled": false  
> }  
> },  
> "type": "ia.display.alarmstatustable"  
> },  
> {  
> "meta": {  
> "name": "AlarmJournalTable"  
> },  
> "position": {  
> "tabIndex": 1  
> },  
> "type": "ia.display.alarmjournaltable"  
> }  
> ],  
> "meta": {  
> "name": "TabContainer"  
> },  
> "position": {  
> "basis": "633px",  
> "grow": 1  
> },  
> "props": {  
> "contentStyle": {  
> "classes": "Service/BackgroundColor"  
> },  
> "style": {  
> "classes": "Service/BackgroundColor"  
> },  
> "tabSize": {  
> "width": 150  
> },  
> "tabStyle": {  
> "active": {  
> "backgroundColor": "#32576F",  
> "borderStyle": "solid",  
> "borderWidth": "1px",  
> "color": "white",  
> "fontSize": "20px"  
> },  
> "inactive": {  
> "borderColor": "white",  
> "borderStyle": "solid",  
> "borderWidth": "1px",  
> "color": "#AAAAAA"  
> }  
> },  
> "tabs": [  
> "Active Alarms",  
> "Alarms History"  
> ]  
> },  
> "type": "ia.container.tab"  
> }  
> ],  
> "meta": {  
> "name": "root"  
> },  
> "props": {  
> "direction": "column",  
> "style": {  
> "classes": "Service/BackgroundColor"  
> }  
> },  
> "type": "ia.container.flex"  
> }  
> }

and in stylesheet written.

```auto
#alarmTable .ia_table_headContainer{
	background-color:red;
}

```

However background color of headcontainer did not change.

Thanks in advance

---

<div class="post-metadata">

**Author:** ![Arnaud\_Declerck](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/arnaud_declerck/32/44872_2.png) [@Arnaud\_Declerck](https://forum.inductiveautomation.com/u/Arnaud_Declerck)\
**Post date:** [September 5, 2023, 6:11am UTC](https://forum.inductiveautomation.com/t/alarms-table-headcontainer-color-not-updating/78712/2 "2023-09-05T06:11:39Z")

</div>

Hi,  
i think you're missing an underscore.

try

```auto
#alarmTable .ia_table__headContainer{
  background-color:black;
}

```

make sure like explained in the topic that you set the domId of your alarm object to alarmTable  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/7/b/7b02aa7cc7e8fe633d174fdb80540381990a96b8.png)

regards

---

<div class="post-metadata">

**Author:** ![Learner\_Ignition](https://avatars.discourse-cdn.com/v4/letter/l/b3f665/32.png) [@Learner\_Ignition](https://forum.inductiveautomation.com/u/Learner_Ignition)\
**Post date:** [September 5, 2023, 7:07am UTC](https://forum.inductiveautomation.com/t/alarms-table-headcontainer-color-not-updating/78712/3 "2023-09-05T07:07:46Z")

</div>

I miss the underscore.

Thanks