# Center gauge in masonary container

**URL:** <https://discourse.nodered.org/t/center-gauge-in-masonary-container/83949>\
**Category:** Dashboard\
**Created:** [22 December 2023 08:58 UTC](https://discourse.nodered.org/t/center-gauge-in-masonary-container/83949 "2023-12-22T08:58:26Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Sirhc](https://avatars.discourse-cdn.com/v4/letter/s/b77776/32.png) [@Sirhc](https://discourse.nodered.org/u/Sirhc)\
**Post date:** [22 December 2023 08:58 UTC](https://discourse.nodered.org/t/center-gauge-in-masonary-container/83949/1 "2023-12-22T08:58:26Z")

</div>

Hello

I have a masonary container with a gauge in it. It is shown below.

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

I have some CSS for it:

> #nr-dashboard .masonry-container ui-card-panel#Pool\_Water {
> 
> box-shadow: 0 0 6px #00000070;
> 
> background: transparent;
> 
> border:none;
> 
> }

Does anyone know how to center the gauge in the container? It's currently aligned right. I have tried align-items: center; but that didn't work :\

---

<div class="post-metadata">

**Author:** ![marcus-j-davies](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/marcus-j-davies/32/103435_2.png) [@marcus-j-davies](https://discourse.nodered.org/u/marcus-j-davies)\
**Post date:** [22 December 2023 09:52 UTC](https://discourse.nodered.org/t/center-gauge-in-masonary-container/83949/2 "2023-12-22T09:52:41Z")

</div>

Hi @Sirhc

I am not a pro with dashboard, better people here than I, but...

If you add a `ui_template` node, and set to appear in the `head` section with the following.

```auto
<style>
    .center-gauge {
        width:100% !important;
    }
</style>

```

Then, add a class to your gauge node

 ![Screenshot 2023-12-22 at 09.52.08](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/1/6/16d0ad49d75b89afc4c6185b9e4ec980ccf42ed1.png)

 ![Screenshot 2023-12-22 at 09.52.25](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/f/5/f5944a105613e0f3a8535b45f6c0f5064886531a.png)

---

<div class="post-metadata">

**Author:** ![Sirhc](https://avatars.discourse-cdn.com/v4/letter/s/b77776/32.png) [@Sirhc](https://discourse.nodered.org/u/Sirhc)\
**Post date:** [27 December 2023 21:33 UTC](https://discourse.nodered.org/t/center-gauge-in-masonary-container/83949/3 "2023-12-27T21:33:09Z")

</div>

Thank you!

---

<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:** [25 February 2024 21:33 UTC](https://discourse.nodered.org/t/center-gauge-in-masonary-container/83949/4 "2024-02-25T21:33:23Z")

</div>

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