How to place a image in center?

[Serenade600]

I want to place a image centered. So I tried the following code in the particular slide page:

---

# Reactor

<style scoped>
img {justify-content: center}
</style>

![](./img/maze.png)

---

But the result I got is not centered. I screenshot this page, so please ignore the black border.

Is there something I set wrong? I'am using marp in vs code.

[Serenade600]

I see here https://github.com/orgs/marp-team/discussions/283#discussioncomment-2393104. It said that only background syntax is used for figure. So I changed the previous code to

<style scoped>
img {background-position: center}
</style>

Also didn't work. I also changed the element img to figure. Still didn't work.
I'm a newbie about marp and html. Just attracted by the awesome feature by Marp. Hope this question doesn't offend anyone.

[yhatt]

#283 can be only applied for the background image ![bg](), a unique feature of Marp/Marpit. You are using an inline image syntax for general Markdown ![](), that is not a background image. Thus, background-xxxxxxx CSS property cannot apply in this case.

[yhatt]

![](./img/maze.png)

This Markdown renders a following HTML:

<p>
  <img src="./img/maze.png" />
</p>

<p> tag (paragraph) is aligning its contents to left (text-align: left). Thus, using a following style can align contents into center.

<style scoped>
p { text-align: center; }
</style>

See also https://marp.app/blog/the-story-of-marp-next#image for more flexible way. It can define center keyword for the image. (WARNING: This way is abusing an alternative text of the image)