Hi, that draft was great, it really made it clear what you were trying to achieve, thanks!
I went in and modified your draft. If you go to the "text" tab of your editor, you will notice that I added the following, after each "paragraph" of text:
<p style="clear: both;"></p>
I also added one at the very end of your post, because otherwise that image overlapped the the end of the post area.
To learn a bit more about floats and clearing them, you can have a look here:
http://css-tricks.com/all-about-floats/
Basically, when you "align" an image in the WordPress editor, you are actually floating them left or right. That means that all the text will flow "around" them, as is explained in the article I linked to. By adding an empty paragraph element with a "clear:both" style in it, you are stopping the flowing and floating for the previous elements, which allows you to align the next elements as you'd like.
If you find that using a p (paragraph) element adds too much space in between your images, you could try replacing it with a span, like so:
<span style="clear: both;"></span>
I hope this helps! Let me know if you have any further questions.