# Avoid overlaping

**URL:** <https://discourse.nodered.org/t/avoid-overlaping/50920>\
**Category:** Dashboard\
**Created:** [12 September 2021 12:44 UTC](https://discourse.nodered.org/t/avoid-overlaping/50920 "2021-09-12T12:44:57Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![WernerM96](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/wernerm96/32/46471_2.png) [@WernerM96](https://discourse.nodered.org/u/WernerM96)\
**Post date:** [12 September 2021 12:44 UTC](https://discourse.nodered.org/t/avoid-overlaping/50920/1 "2021-09-12T12:44:57Z")

</div>

Hey,

i have a problem. If i scale the browser on full size - a template will overlap with another.  
If i resize it a little bit smaller - it works.  
How can i avoid this problem generally?

Not fullsize:

 ![2](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/1/d/1d3d29dd16a8042cef8013274c05c2b2ae01d842.jpeg)

Fullsize:  
 ![3](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/6/d/6d97836bedc8a1e7f0b7ce25a31cd70c99c3fa0d.jpeg)

The template of the "Trash calendar/reminder":

```auto
<div style="margin-top: 8px" id="my_trashcalendar">
<table style="border-collapse: collapse; width: 100%;" border="0">
<tbody>
<tr>
<td >  
  <center><font color="{{msg.payload[0].color}}"><i class="fa {{msg.payload[0].icon}} fa-3x"></i></font>
  <center><br>{{msg.payload[0].daysLeft}} Tage</br></td>
<td >  
  <center><font color="{{msg.payload[1].color}}"><i class="fa {{msg.payload[1].icon}} fa-3x"></i></font>
  <center><br>{{msg.payload[1].daysLeft}} Tage</br></td>
<td > 
  <center><font color="{{msg.payload[2].color}}"><i class="fa {{msg.payload[2].icon}} fa-3x"></i></font>
  <center><br>{{msg.payload[2].daysLeft}} Tage</br></td>
</tr>
</tbody>
</table>
</div>

```

I wish you all a great sunday!

Best regards,  
WernerM96

---

<div class="post-metadata">

**Author:** ![E1cid](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/e1cid/32/77971_2.png) [@E1cid](https://discourse.nodered.org/u/E1cid)\
**Post date:** [12 September 2021 13:14 UTC](https://discourse.nodered.org/t/avoid-overlaping/50920/2 "2021-09-12T13:14:55Z")

</div>

You are going to have to learn css, it is a learning curve but worth it.

> **[Introduction to CSS layout - Learn web development | MDN](https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Introduction)**
>
> This article has provided a brief summary of all the layout technologies you should know about. Read on for more information on each individual technology!

[https://www.w3schools.com/css/](https://www.w3schools.com/css/)

note - the tags center font are deprecated, and br does not have a closing tag

---

<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:** [12 October 2021 13:15 UTC](https://discourse.nodered.org/t/avoid-overlaping/50920/3 "2021-10-12T13:15:52Z")

</div>

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