Using Markdown, how do I center an image and its caption?

I want to end up with:

Hello there!

      <image>
      This is an image

Hi!

Where the image and the text This is an image are centered on the page. How do I accomplish this with Markdown?

Edit: Note that I'm looking to horizontally center the image and text on the page.

Solution 1:

I figured that I'd just have to use HTML where I want to horizontally align anything.

So my code would look like this:

Hello there!

      <center><img src="" ...></center>
      <center>This is an image</center>

Hi!

Solution 2:

I think I have a simple solution that will work given that you can define CSS. It also does not require any extensions or HTML! First your markdown image code:

![my image](/img/myImage.jpg#center)  

Note the added url hash #center.

Now add this rule in CSS:

img[src*='#center'] { 
    display: block;
    margin: auto;
}

You should be able to use a url hash like this, almost like defining a class name.

To see this in action, check out my JSFiddle using SnarkDown to parse MarkDown in a textarea - https://jsfiddle.net/tremor/6s30e8vr/