# Disable text selection on Dashboard

**URL:** <https://discourse.nodered.org/t/disable-text-selection-on-dashboard/28502>\
**Category:** Dashboard\
**Created:** [17 June 2020 22:32 UTC](https://discourse.nodered.org/t/disable-text-selection-on-dashboard/28502 "2020-06-17T22:32:35Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![JorgeAlberto91MS](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/jorgealberto91ms/32/36444_2.png) [@JorgeAlberto91MS](https://discourse.nodered.org/u/JorgeAlberto91MS)\
**Post date:** [17 June 2020 22:32 UTC](https://discourse.nodered.org/t/disable-text-selection-on-dashboard/28502/1 "2020-06-17T22:32:35Z")

</div>

Hello... I'm Working with a Node-Red Dashboard, my app is running on a Kiosk on Raspbian  
My Raspberry pi board includes a Touch Screen.

¿Is there a way to include CSS in the dashboard to disable text selection and also disable the drag-and-drop feature?

I want to prevent users from accidentally doing this:

 ![Grabación de pantalla 2020-06-17 a la(s) 5.25.30 p. m](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/c/6/c643a54d0c75738416d6336a88853c45d399082e.gif)

Thanks!

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [17 June 2020 23:41 UTC](https://discourse.nodered.org/t/disable-text-selection-on-dashboard/28502/2 "2020-06-17T23:41:20Z")

</div>

> [@JorgeAlberto91MS](#):
>
> Is there a way to include CSS in the dashboard

Yes. Use a ui\_template node set to "add to head" then enter a style tag with your CSS inside.

---

<div class="post-metadata">

**Author:** ![JorgeAlberto91MS](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/jorgealberto91ms/32/36444_2.png) [@JorgeAlberto91MS](https://discourse.nodered.org/u/JorgeAlberto91MS)\
**Post date:** [18 June 2020 01:34 UTC](https://discourse.nodered.org/t/disable-text-selection-on-dashboard/28502/3 "2020-06-18T01:34:41Z")

</div>

OK, thanks for the answer, Steve.

I am not an expert in HTML, CSS and JavaScript  
I understand that with an "ui\_template" I can apply styles to all the HTML content inside it, but I don't know how to apply styles to a component like the dashboard.

Selectable text.

Unselectable text.

.noselect {  
-webkit-touch-callout: none;  
-webkit-user-select: none;  
-khtml-user-select: none;  
-moz-user-select: none;  
-ms-user-select: none;  
user-select: none;  
}

Source of the code: [https://stackoverflow.com/questions/826782/how-to-disable-text-selection-highlighting](https://stackoverflow.com/questions/826782/how-to-disable-text-selection-highlighting)

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [18 July 2020 01:36 UTC](https://discourse.nodered.org/t/disable-text-selection-on-dashboard/28502/4 "2020-07-18T01:36:10Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.