#1

Is there any way to indent the bottom picture like the other two at the top?
Code I used and example output:

<img align="left" width="49%" height="auto" src="link.jpg">
<img align="right" width="49%" height="auto" src="link.jpg">
<img align="center" width="auto" height="auto" src="link.jpg">

Bottom picture not indented
Bottom picture not indented1030×235 215 KB

#2

I don’t understand what you’re asking. The edges of the bottom picture line up with the edges of the top ones, and there’s no background on either side to suggest that anything is indented.

#3

I’m asking how to move the bottom picture apart from two above, how to add gap between these pictures.

#4

Ah, OK.

This probably doesn’t work, but does adding a blank line do it?

<img align="left" width="49%" height="auto" src="link.jpg">
<img align="right" width="49%" height="auto" src="link.jpg">

<img align="center" width="auto" height="auto" src="link.jpg">

(It wouldn’t work in a normal webpage, but maybe it works here in a Markdown app.)

Otherwise, you could use CSS to add some margin, for example:

<img align="center" width="auto" height="auto" src="link.jpg" 
style="top-margin: 1em;">

If you don’t know CSS you can read up on the various measurement units and fancier methods of CSS layout at CSS: Cascading Style Sheets | MDN.

You can also pull the styling out of the HTML into a separate snippet to make it easier to maintain, with markup like:

<img align="center" width="auto" height="auto" src="link.jpg" 
class="specialpics">

and styling like:

.specialpics {margin-top: 1em;}