# Removing blue outline when cell is clicked in a Perspective table

**URL:** <https://forum.inductiveautomation.com/t/removing-blue-outline-when-cell-is-clicked-in-a-perspective-table/49151>\
**Category:** Ignition\
**Created:** [July 23, 2021, 5:10pm UTC](https://forum.inductiveautomation.com/t/removing-blue-outline-when-cell-is-clicked-in-a-perspective-table/49151 "2021-07-23T17:10:01Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![mdelara](https://avatars.discourse-cdn.com/v4/letter/m/3da27b/32.png) [@mdelara](https://forum.inductiveautomation.com/u/mdelara)\
**Post date:** [July 23, 2021, 5:10pm UTC](https://forum.inductiveautomation.com/t/removing-blue-outline-when-cell-is-clicked-in-a-perspective-table/49151/1 "2021-07-23T17:10:01Z")

</div>

Hi, is there a way to remove the outline of the cell in a Perspective editable table when it is clicked? I tried outlineStyle = “none” under cell property but it seems to have no effect. The reason I asked is because when I clicked multiple cells, some outlines remained even after I clicked other cells. Below is a sample image. Thanks in advance.

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/4/5/459c8b291c520edd8c84a73d956ec4c7bf81f8e8.png)

---

<div class="post-metadata">

**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\
**Post date:** [July 26, 2021, 7:04am UTC](https://forum.inductiveautomation.com/t/removing-blue-outline-when-cell-is-clicked-in-a-perspective-table/49151/2 "2021-07-26T07:04:14Z")

</div>

Thats odd. Ive not seen that before. Im guessing something else happends here,  
You should inspect the css from the cells that have a border.  
Open the page in the browser and press ctrl+shift+c then hover over the cell and on the inspector you should appear either on the div of the cell or the text. Find out which of the two give a border and why

But you can adjust it with themse.css (or injecetion)

this would remove the border from selection

```auto
.ia_tableComponent__selection--root {

 border: none;

}

```

This the background color

```auto
.ia_tableComponent__selection {

 background-color: transparent ;

}

```

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/9/3/931f6434223e0bd21b400fb19e26cc9f1f9bb6eb.png)

---

<div class="post-metadata">

**Author:** ![mdelara](https://avatars.discourse-cdn.com/v4/letter/m/3da27b/32.png) [@mdelara](https://forum.inductiveautomation.com/u/mdelara)\
**Post date:** [July 26, 2021, 5:17pm UTC](https://forum.inductiveautomation.com/t/removing-blue-outline-when-cell-is-clicked-in-a-perspective-table/49151/3 "2021-07-26T17:17:25Z")

</div>

Thanks @victordcq. I learned something new. This is what worked for me in my theme overrides:

.ia\_tableComponent\_\_editableCell  
{  
border: none;  
box-shadow: 0 2px 8px 0 rgb(0 0 0 / 30%);  
background-color: transparent;  
}

.ia\_tableComponent\_\_selection–root {  
border: none;  
}

.ia\_tableComponent\_\_selection {  
background-color: transparent;  
}

---

<div class="post-metadata">

**Author:** ![Aiasa21](https://avatars.discourse-cdn.com/v4/letter/a/aeb1de/32.png) [@Aiasa21](https://forum.inductiveautomation.com/u/Aiasa21)\
**Post date:** [September 18, 2024, 12:53pm UTC](https://forum.inductiveautomation.com/t/removing-blue-outline-when-cell-is-clicked-in-a-perspective-table/49151/4 "2024-09-18T12:53:54Z")

</div>

> [@mdelara](#):
>
> ell  
> {  
> border: none;  
> box-shadow: 0 2px 8px 0 rgb(0 0 0 / 30%);  
> background-color: transparent;  
> }
> 
> .ia\_tableComponent\_\_selection–root {  
> border: none;  
> }
> 
> .ia\_tableComponent\_\_selection {  
> background-color: transparent;  
> }

Hi, I created this styles to remove the background and the border during the row selection but actually what happen is that is removed only the background of the selected cell, and not of the all row, I tried to inspect in the browser but I can't find how to fix this.

Thank you for the help

---

<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:** [September 18, 2024, 1:01pm UTC](https://forum.inductiveautomation.com/t/removing-blue-outline-when-cell-is-clicked-in-a-perspective-table/49151/5 "2024-09-18T13:01:09Z")

</div>

You don't need the stylesheet for that, just use the built-in `props.selection.style` of the table.

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/7/0/70d9c345fb80a783e4797f60ccb8f369c89bed8a.png)I

Note that it seems to me like a bad idea to remove that indication...

---

<div class="post-metadata">

**Author:** ![Aiasa21](https://avatars.discourse-cdn.com/v4/letter/a/aeb1de/32.png) [@Aiasa21](https://forum.inductiveautomation.com/u/Aiasa21)\
**Post date:** [September 18, 2024, 1:23pm UTC](https://forum.inductiveautomation.com/t/removing-blue-outline-when-cell-is-clicked-in-a-perspective-table/49151/6 "2024-09-18T13:23:57Z")

</div>

You're right, thanks for the help it works.

Actually I add the top and bottom borders so to highlight better the selection and the background disturb the reading of the text when is selected.

Thank again!
