The stacking order was left then left right
Foundation is great, but you are confused on the grid. Since the grid is about Mobile first, if you want the grid to fold over and stack neatly in all one column in Mobile, you need to use large-
Like you I used Foundation 5. I never used a previous version so I am a newbie too, but I’m learning all I can.
If you are duplicating an older layout where Left is Aside, and not the Right, you can use push pull command. Otherwise the above I tested with my own images in Foundation 5.
small-x grid keeps the same no matter how small, and is best used with whatever looks good in mobile. You can swap the dimensions different in large-view for a two column grid by combining the styles like this, I have done:
I duplicated your code, but I used all images in portrait mode rather than mixed portrait/landscape. I also changed the image tags to display images from my “_img” folder
The stacking order was left then left right then far right, and repeat.
Essentially small is for when you do not want stacking behavior.
I hope that helps.