# Issue with template node

**URL:** <https://discourse.nodered.org/t/issue-with-template-node/1235>\
**Category:** Dashboard\
**Created:** [2 July 2018 12:38 UTC](https://discourse.nodered.org/t/issue-with-template-node/1235 "2018-07-02T12:38:15Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![realjax](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/realjax/32/895_2.png) [@realjax](https://discourse.nodered.org/u/realjax)\
**Post date:** [2 July 2018 12:38 UTC](https://discourse.nodered.org/t/issue-with-template-node/1235/1 "2018-07-02T12:38:15Z")

</div>

Hello,

I have a question about the use of the dashboard template node.  
I have a template that contains some code to set a switch, (I can not use the dashboard switch node for this because of some custom stuff)  
here is the code that is in the template:

```
<div layout="row" layout-align="space-between center">
    <p>test switch</p>
    <md-switch aria-label="test" ></md-switch>
</div>

```

When I set the size of the node to auto, it looks like this (used two template nodes here with the exact same code for clearity):

![26](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d2485b6508e5bb5adff029bd40b0f74398e99471.jpg)

Which is a bit on the high side 🙂.  
However, when I set the size of the node to 6x1 it looks like this:

![17](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/605e51a708b678f47919c35b71eb05bb27e68a6f.PNG)

Got two bonus scroll bars on the right side.

This seems to be caused by the `overflow-y: auto` setting of the nr-dashboard-template CSS class. Removing that setting (using Chrome's developer mode) turns it into this:

![16](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/818994a55f57814558e9bb1b4f5640a8a3811be7.jpg)

Which is fine.  
So, to cut a long story short.. how can I roll my own app.min.css to fix this, or is there another way ?

(running latest version of Node-red on Armbian 5.38)

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [2 July 2018 12:46 UTC](https://discourse.nodered.org/t/issue-with-template-node/1235/2 "2018-07-02T12:46:03Z")

</div>

why not add the css direct to your template div ?

---

<div class="post-metadata">

**Author:** ![realjax](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/realjax/32/895_2.png) [@realjax](https://discourse.nodered.org/u/realjax)\
**Post date:** [2 July 2018 12:48 UTC](https://discourse.nodered.org/t/issue-with-template-node/1235/3 "2018-07-02T12:48:37Z")

</div>

Because that doesn’t help, the overflow-y: auto set of its parents md-card keeps adding the scrollbars.

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [2 July 2018 12:51 UTC](https://discourse.nodered.org/t/issue-with-template-node/1235/4 "2018-07-02T12:51:23Z")

</div>

ok - just restyle the card then… -

eg related enough to be similar - [Removing or making the ui\_text not have a background color](https://discourse.nodered.org/t/removing-or-making-the-ui-text-not-have-a-background-color/1212)

---

<div class="post-metadata">

**Author:** ![realjax](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/realjax/32/895_2.png) [@realjax](https://discourse.nodered.org/u/realjax)\
**Post date:** [2 July 2018 18:42 UTC](https://discourse.nodered.org/t/issue-with-template-node/1235/5 "2018-07-02T18:42:00Z")

</div>

Good idea! I’ll give that a go, thanks!

---

<div class="post-metadata">

**Author:** ![realjax](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/realjax/32/895_2.png) [@realjax](https://discourse.nodered.org/u/realjax)\
**Post date:** [2 July 2018 18:48 UTC](https://discourse.nodered.org/t/issue-with-template-node/1235/6 "2018-07-02T18:48:39Z")

</div>

Worked like a charm!
