how to automatically center images on slides?

[incandescentman]

I believe I've tried all available org-mode to HTML and Markdown to HTML slideshow systems, and org-html-slideshow is still the best I've seen. I am having an issue, though, centering images in presentations. Forgive the newbie question, non-programmer here.

I have a lot of slides that consist of images. The org subtree looks like this:

* Foo Slide Title                                                   :slide:
[[/Users/foo/Dropbox/presentations/org-html-slideshows/bar/img/image.jpg]] 

This works perfectly for generating slides with images, except that the images are left-aligned when I want them centered. I want them to align with the slide title, which is also centered horizontally.

I tried adding this CSS, but it had no effect:

p.image {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

This didn't work either:

.figure {
    width: 100%; 
    margin-left: auto;
    margin-right: auto;
}

Can you help me make it so images get automatically centered? Thanks!

[jaydixit]

img,video,audio,iframe { display: block; margin: 0 auto; }

[Sukarnascience]

Try out this in your CSS file
body { background:rgb(120, 120, 120); margin: 0; position: absolute; top: 50%; left: 50%; margin-right: -50%; transform: translate(-50%, -50%) }

OR
to center img

.center { display: block; margin-left: auto; margin-right: auto; width: 50%; }