# Widget Alignment

**URL:** <https://discourse.nodered.org/t/widget-alignment/69414>\
**Category:** Dashboard\
**Tags:** node-red-dashboard, ui-widgets\
**Created:** [22 October 2022 04:23 UTC](https://discourse.nodered.org/t/widget-alignment/69414 "2022-10-22T04:23:17Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Limninzz](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/limninzz/32/78007_2.png) [@Limninzz](https://discourse.nodered.org/u/Limninzz)\
**Post date:** [22 October 2022 04:23 UTC](https://discourse.nodered.org/t/widget-alignment/69414/1 "2022-10-22T04:23:17Z")

</div>

Hello, could somebody please guide me how to align widget ?  
i use node-red dashboard and custom template with css.  
And i want to move "Slider widget" to the bottom of "Gauge Widget" just like the picture attached.

 ![nodered](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/9/4/94c38b73ff95dca316e83e8bad0392bdfffc203c.jpeg)

---

<div class="post-metadata">

**Author:** ![Limninzz](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/limninzz/32/78007_2.png) [@Limninzz](https://discourse.nodered.org/u/Limninzz)\
**Post date:** [22 October 2022 04:50 UTC](https://discourse.nodered.org/t/widget-alignment/69414/2 "2022-10-22T04:50:49Z")

</div>

@hotNipi could you please help me sir ?

---

<div class="post-metadata">

**Author:** ![bakman2](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bakman2/32/6207_2.png) [@bakman2](https://discourse.nodered.org/u/bakman2)\
**Post date:** [22 October 2022 06:08 UTC](https://discourse.nodered.org/t/widget-alignment/69414/3 "2022-10-22T06:08:38Z")

</div>

You can adjust the elements via the UI.

![SCR-20221022-b88](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/c/f/cfa263108fde5e51b9c02e07baf0d11341d650f5.png)

 ![SCR-20221022-b77](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/2/b/2bae9110e4298e2523077c3e9c15fcf8a448b41f.png)

Move the square around to your liking.

 ![SCR-20221022-b9w](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/7/0/7093ee739c4e8aa5ee4c316c639862562c408935.png)

---

<div class="post-metadata">

**Author:** ![Limninzz](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/limninzz/32/78007_2.png) [@Limninzz](https://discourse.nodered.org/u/Limninzz)\
**Post date:** [22 October 2022 08:06 UTC](https://discourse.nodered.org/t/widget-alignment/69414/4 "2022-10-22T08:06:11Z")

</div>

Lol, i focused to much on CSS manipulation and didn't even realize it was there...  
I'm new at this, so sorry and thank you so much for the solution @bakman2

---

<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:** [5 November 2022 08:06 UTC](https://discourse.nodered.org/t/widget-alignment/69414/5 "2022-11-05T08:06:25Z")

</div>

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