# Node-red-contrib-ui-media

**URL:** <https://discourse.nodered.org/t/node-red-contrib-ui-media/28530>\
**Category:** Dashboard\
**Created:** [18 June 2020 07:36 UTC](https://discourse.nodered.org/t/node-red-contrib-ui-media/28530 "2020-06-18T07:36:49Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Kees](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/kees/32/5881_2.png) [@Kees](https://discourse.nodered.org/u/Kees)\
**Post date:** [18 June 2020 07:36 UTC](https://discourse.nodered.org/t/node-red-contrib-ui-media/28530/1 "2020-06-18T07:36:49Z")

</div>

Is it possible to adjust and to center a picture at the same time?

---

<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:** [18 June 2020 21:53 UTC](https://discourse.nodered.org/t/node-red-contrib-ui-media/28530/2 "2020-06-18T21:53:04Z")

</div>

Did you look at the options of the node?

---

<div class="post-metadata">

**Author:** ![Kees](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/kees/32/5881_2.png) [@Kees](https://discourse.nodered.org/u/Kees)\
**Post date:** [19 June 2020 08:50 UTC](https://discourse.nodered.org/t/node-red-contrib-ui-media/28530/3 "2020-06-19T08:50:17Z")

</div>

Do you mean with "options" the layout in the configuration tab in the properties of the node?

---

<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:** [19 June 2020 09:03 UTC](https://discourse.nodered.org/t/node-red-contrib-ui-media/28530/4 "2020-06-19T09:03:03Z")

</div>

yes, did you try setting the adjust to 'center'? or do you mean ou want to use 'Adjust' and then center the image also?

If that isthe case, you cold try adding a `ui-template` node and set the 'Template type' to 'Added to site section' and use something like this:

```auto
<style>
    #Home_media_cards img {
        margin: 50%;
        margin-left: auto;
        margin-right: auto;
    }
</style>
where 'Home' is the `tab` name and `media` is the `group` name where the media is in.
```

---

<div class="post-metadata">

**Author:** ![Kees](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/kees/32/5881_2.png) [@Kees](https://discourse.nodered.org/u/Kees)\
**Post date:** [22 June 2020 14:55 UTC](https://discourse.nodered.org/t/node-red-contrib-ui-media/28530/5 "2020-06-22T14:55:46Z")

</div>

Yes, that is what I mean: adjust the image and then center it.  
I understand there are other ways to get that result by adding a template. However for me the reason to use this node is that you don't need an additional template. It would be nice if there was an option to get the same result.

---

<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:** [22 June 2020 16:04 UTC](https://discourse.nodered.org/t/node-red-contrib-ui-media/28530/6 "2020-06-22T16:04:14Z")

</div>

Why don't you raise an issue to the author on it's github page?

---

<div class="post-metadata">

**Author:** ![Kees](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/kees/32/5881_2.png) [@Kees](https://discourse.nodered.org/u/Kees)\
**Post date:** [23 June 2020 07:41 UTC](https://discourse.nodered.org/t/node-red-contrib-ui-media/28530/7 "2020-06-23T07:41:01Z")

</div>

I have done that.  
Thanks.

---

<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:** [23 July 2020 07:41 UTC](https://discourse.nodered.org/t/node-red-contrib-ui-media/28530/8 "2020-07-23T07:41:08Z")

</div>

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