# I can't have different font sizes

**URL:** <https://discourse.nodered.org/t/i-cant-have-different-font-sizes/27320>\
**Category:** Dashboard\
**Created:** [26 May 2020 15:39 UTC](https://discourse.nodered.org/t/i-cant-have-different-font-sizes/27320 "2020-05-26T15:39:30Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![RyuunosukeDS3](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/ryuunosukeds3/32/22503_2.png) [@RyuunosukeDS3](https://discourse.nodered.org/u/RyuunosukeDS3)\
**Post date:** [26 May 2020 15:39 UTC](https://discourse.nodered.org/t/i-cant-have-different-font-sizes/27320/1 "2020-05-26T15:39:30Z")

</div>

Whenever i go to the ui\_text node and write  
`<font size =15>some text</font>` it doesn't matter the size i put, it is always 35. Probably because of some other ui\_text. What can i do ("can't share flow since it's for the company I work")

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/7/c/7c691e2bcaf61220977b7e6ce56f04989ae1a113.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:** [26 May 2020 16:37 UTC](https://discourse.nodered.org/t/i-cant-have-different-font-sizes/27320/2 "2020-05-26T16:37:17Z")

</div>

> [@RyuunosukeDS3](#):
>
> some text

where are you putting the `<font size =15>some text</font>`? In the `value format`?

Have you use a web inspector tool in your browser to see what is happening?

Have you tried using the ui\_template to pass in some CSS?

BTY, the tag is not supported in HTML5 you shoud use CSS instead. Try this

`<p style="font-size=15px">some text</p>`

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [26 May 2020 17:09 UTC](https://discourse.nodered.org/t/i-cant-have-different-font-sizes/27320/3 "2020-05-26T17:09:54Z")

</div>

Define font size with some unit. px or em or ....

---

<div class="post-metadata">

**Author:** ![RyuunosukeDS3](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/ryuunosukeds3/32/22503_2.png) [@RyuunosukeDS3](https://discourse.nodered.org/u/RyuunosukeDS3)\
**Post date:** [26 May 2020 17:15 UTC](https://discourse.nodered.org/t/i-cant-have-different-font-sizes/27320/4 "2020-05-26T17:15:20Z")

</div>

i'm puting it in the value, where the {{msg.payload}} goes. I have tried using a web inspector but it didn't help me much...  
I have tried ui\_template with some CSS the problem with that, is that i can't make the numbers big while the units are small, or can i?  
i've tried with `<p style></p>`, no can do.

---

<div class="post-metadata">

**Author:** ![RyuunosukeDS3](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/ryuunosukeds3/32/22503_2.png) [@RyuunosukeDS3](https://discourse.nodered.org/u/RyuunosukeDS3)\
**Post date:** [26 May 2020 17:15 UTC](https://discourse.nodered.org/t/i-cant-have-different-font-sizes/27320/5 "2020-05-26T17:15:33Z")

</div>

didn't work.

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [26 May 2020 17:30 UTC](https://discourse.nodered.org/t/i-cant-have-different-font-sizes/27320/6 "2020-05-26T17:30:48Z")

</div>

That paragraph has class "value" Identify from where it comes , override or add your custom class for elements you can control.  
Hard to do css without seeing whole thing.

---

<div class="post-metadata">

**Author:** ![RyuunosukeDS3](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/ryuunosukeds3/32/22503_2.png) [@RyuunosukeDS3](https://discourse.nodered.org/u/RyuunosukeDS3)\
**Post date:** [26 May 2020 17:48 UTC](https://discourse.nodered.org/t/i-cant-have-different-font-sizes/27320/7 "2020-05-26T17:48:45Z")

</div>

Gon try that tomorrow, Thanks!

---

<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:** [26 May 2020 17:54 UTC](https://discourse.nodered.org/t/i-cant-have-different-font-sizes/27320/8 "2020-05-26T17:54:30Z")

</div>

The easiest thing is to use a code inspector to look at the item you want. In this example I'm using Safari and have selected the 'some text' causing the below output. Scanning it's parents, you will see `id="Home_Group_2_cards"` which can be used to uniquely identify this section of HTML.

 ![Screen Shot 2020-05-26 at 1.47.43 PM](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/4/6/467e7d50480288111647fadff79540fc656c4a26.png)

Then add a `ui-template node` and set the `Template type` to `Added to site section and add in the CSS you want. Here is an example where I set the font-size to 48px  
![Screen Shot 2020-05-26 at 1.50.35 PM|502x365]  
and here is the result:

 ![Screen Shot 2020-05-26 at 1.53.27 PM](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/0/c/0cb05ba6c907008196db16163de5868def7f6c29.png)

---

<div class="post-metadata">

**Author:** ![RyuunosukeDS3](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/ryuunosukeds3/32/22503_2.png) [@RyuunosukeDS3](https://discourse.nodered.org/u/RyuunosukeDS3)\
**Post date:** [26 May 2020 22:24 UTC](https://discourse.nodered.org/t/i-cant-have-different-font-sizes/27320/9 "2020-05-26T22:24:06Z")

</div>

That worked. I created a "mystyle" class and then changed the class of text i wanted with mystyle and then to test it out i also made a second mystyle class the "mystyle2" and then set like this

````auto
font-size=25px
}
<font class="mystyle">some text 1</font>```
.mystyle2{
font-size=8px
}
<font class="mystyle2">some text 2</font>

````

this is how it went:

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/2/e/2eb172ece67175a16b1a58aa05e26818be0ac2e0.png)

---

<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:** [9 June 2020 22:24 UTC](https://discourse.nodered.org/t/i-cant-have-different-font-sizes/27320/10 "2020-06-09T22:24:23Z")

</div>

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