# Text width full size

**URL:** <https://discourse.nodered.org/t/text-width-full-size/1503>\
**Category:** Dashboard\
**Created:** [11 July 2018 09:59 UTC](https://discourse.nodered.org/t/text-width-full-size/1503 "2018-07-11T09:59:57Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![EnricoSx](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/enricosx/32/945_2.png) [@EnricoSx](https://discourse.nodered.org/u/EnricoSx)\
**Post date:** [11 July 2018 09:59 UTC](https://discourse.nodered.org/t/text-width-full-size/1503/1 "2018-07-11T09:59:58Z")

</div>

I would like to create a dashboard with text as wide as the entire browser window, how do I do it?

 ![](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/d/d1db5cf1b7cf8f5f0706e898b9831ad983f19b61.png)

---

<div class="post-metadata">

**Author:** ![zenofmud](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/zenofmud/32/316_2.png) [@zenofmud](https://discourse.nodered.org/u/zenofmud)\
**Post date:** [11 July 2018 11:47 UTC](https://discourse.nodered.org/t/text-width-full-size/1503/2 "2018-07-11T11:47:13Z")

</div>

No. It is a responsive design. You can read about it in the description of the node

> **[node-red-dashboard](https://flows.nodered.org/node/node-red-dashboard)**
>
> A set of dashboard nodes for Node-RED

---

<div class="post-metadata">

**Author:** ![EnricoSx](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/enricosx/32/945_2.png) [@EnricoSx](https://discourse.nodered.org/u/EnricoSx)\
**Post date:** [11 July 2018 11:59 UTC](https://discourse.nodered.org/t/text-width-full-size/1503/3 "2018-07-11T11:59:26Z")

</div>

oh ☹  
but text sometimes is cut

![Schermata%20del%202018-07-11%2014-01-26](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/6/6cee825f3030ad8f16410bda7bba9019eefa79a0.png)

---

<div class="post-metadata">

**Author:** ![EnricoSx](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/enricosx/32/945_2.png) [@EnricoSx](https://discourse.nodered.org/u/EnricoSx)\
**Post date:** [11 July 2018 12:02 UTC](https://discourse.nodered.org/t/text-width-full-size/1503/4 "2018-07-11T12:02:21Z")

</div>

![Schermata%20del%202018-07-11%2014-02-08](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/6/6d4b6e8ffc6f12252b7b6aebf7ee7d3999b7d8f9.png)

```
`[{"id":"7abaa53a.fd8b7c","type":"inject","z":"e333e992.e12c98","name":"","topic":"","payload":"","payloadType":"str","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":210,"y":60,"wires":[["bec485db.f879b8"]]},{"id":"bec485db.f879b8","type":"http request","z":"e333e992.e12c98","name":"Richieste API","method":"GET","ret":"obj","url":"https://launchlibrary.net/1.4/launch/next/1","tls":"","x":200,"y":120,"wires":[["1682515.db605af"]]},{"id":"85daaa39.143698","type":"debug","z":"e333e992.e12c98","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","x":390,"y":420,"wires":[]},{"id":"1682515.db605af","type":"change","z":"e333e992.e12c98","name":"","rules":[{"t":"set","p":"payload","pt":"msg","to":"payload.launches[0]","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":200,"y":180,"wires":[["5cc6cb26.917d74","c5a6fee6.e994e","85daaa39.143698"]]},{"id":"5cc6cb26.917d74","type":"ui_text","z":"e333e992.e12c98","group":"b488e1e6.51f69","order":0,"width":0,"height":0,"name":"","label":"Nome","format":"{{msg.payload.name}}","layout":"row-spread","x":410,"y":140,"wires":[]},{"id":"c5a6fee6.e994e","type":"ui_text","z":"e333e992.e12c98","group":"b488e1e6.51f69","order":0,"width":"0","height":"0","name":"","label":"Descrizione","format":"{{msg.payload.missions[0].description}}","layout":"row-spread","x":430,"y":180,"wires":[]},{"id":"b488e1e6.51f69","type":"ui_group","z":"","name":"Group 1","tab":"b382f858.9d8ea8","order":1,"disp":false,"width":"9","collapse":false},{"id":"b382f858.9d8ea8","type":"ui_tab","name":"Tab 3","icon":"dashboard","order":1}]`
```

---

<div class="post-metadata">

**Author:** ![EnricoSx](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/enricosx/32/945_2.png) [@EnricoSx](https://discourse.nodered.org/u/EnricoSx)\
**Post date:** [11 July 2018 12:37 UTC](https://discourse.nodered.org/t/text-width-full-size/1503/5 "2018-07-11T12:37:33Z")

</div>

![Schermata%20del%202018-07-11%2014-37-19](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/5/506876cb3a7cb8094073c98fb048e81251159ede.png)

---

<div class="post-metadata">

**Author:** ![EnricoSx](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/enricosx/32/945_2.png) [@EnricoSx](https://discourse.nodered.org/u/EnricoSx)\
**Post date:** [11 July 2018 13:35 UTC](https://discourse.nodered.org/t/text-width-full-size/1503/6 "2018-07-11T13:35:02Z")

</div>

i read i need to use ui\_template for output multiline responsive, how can i do?  
thanks

---

<div class="post-metadata">

**Author:** ![Andrei](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/andrei/32/10446_2.png) [@Andrei](https://discourse.nodered.org/u/Andrei)\
**Post date:** [11 July 2018 16:29 UTC](https://discourse.nodered.org/t/text-width-full-size/1503/7 "2018-07-11T16:29:13Z")

</div>

You may use a function template to format and style an html output that will feed the ui\_template. You can apply all sorts of CSS styling in the function template.

 ![r-0001](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/a/ad8416787c03eacfd5382c4203782fb36c8db459.PNG) ![r-0002](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/8/8e1a696fbc981224db94072a46d65c09e988c329.PNG)

```auto
[{"id":"29756df7.162bd2","type":"tab","label":"Flow 6","disabled":false,"info":""},{"id":"d823059e.177e78","type":"inject","z":"29756df7.162bd2","name":"","topic":"","payload":"","payloadType":"str","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":230,"y":80,"wires":[["fba691ba.f1c4c"]]},{"id":"fba691ba.f1c4c","type":"http request","z":"29756df7.162bd2","name":"Richieste API","method":"GET","ret":"obj","url":"https://launchlibrary.net/1.4/launch/next/1","tls":"","x":300,"y":160,"wires":[["fe0a6c63.50b0e"]]},{"id":"fe0a6c63.50b0e","type":"change","z":"29756df7.162bd2","name":"","rules":[{"t":"set","p":"payload","pt":"msg","to":"payload.launches[0]","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":300,"y":220,"wires":[["f04842f8.914d1"]]},{"id":"afc4c2a8.0603d","type":"ui_template","z":"29756df7.162bd2","group":"9638a658.2648b8","name":"","order":0,"width":"7","height":"6","format":"<div ng-bind-html=\"msg.payload\"></div>\n","storeOutMessages":true,"fwdInMessages":true,"templateScope":"local","x":920,"y":220,"wires":[[]]},{"id":"f04842f8.914d1","type":"change","z":"29756df7.162bd2","name":"","rules":[{"t":"set","p":"payload","pt":"msg","to":"payload.missions[0].description","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":520,"y":220,"wires":[["7ca70f54.2a063"]]},{"id":"7ca70f54.2a063","type":"template","z":"29756df7.162bd2","name":"Function Template","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"\n<!DOCTYPE html>\n<html>\n<head>\n \n</head>\n\n<body>\n \n <div>\n {{payload}}\n </div>\n \n</body>\n</html>","output":"str","x":750,"y":220,"wires":[["afc4c2a8.0603d"]]},{"id":"9638a658.2648b8","type":"ui_group","z":"","name":"Group 1","tab":"c1dae2ef.c3a59","order":1,"disp":false,"width":"9","collapse":false},{"id":"c1dae2ef.c3a59","type":"ui_tab","name":"Tab 3","icon":"dashboard","order":1}]

```

---

<div class="post-metadata">

**Author:** ![zenofmud](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/zenofmud/32/316_2.png) [@zenofmud](https://discourse.nodered.org/u/zenofmud)\
**Post date:** [12 July 2018 10:51 UTC](https://discourse.nodered.org/t/text-width-full-size/1503/8 "2018-07-12T10:51:29Z")

</div>

I think the OP's issue or concern is that when you resize the window, the text in the box does not reflow and remain readable withour having to use the scroll bars that will pop up.